Put the search bar into an HTML form (#669)

This enables "Add a keyword for this search" in the contex menu for the
search field, in Firefox and other browsers.
This commit is contained in:
Matt Brubeck 2018-04-21 08:27:51 -07:00 committed by Michael Bryan
parent c195aa990d
commit 1c71eaa964
2 changed files with 6 additions and 3 deletions

View file

@ -116,9 +116,9 @@
{{#if search_enabled}}
<div id="search-wrapper" class="hidden">
<div id="searchbar-outer" class="searchbar-outer">
<input type="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
</div>
<form id="searchbar-outer" class="searchbar-outer">
<input type="search" name="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
</form>
<div id="searchresults-outer" class="searchresults-outer hidden">
<div id="searchresults-header" class="searchresults-header"></div>
<ul id="searchresults">

View file

@ -242,6 +242,7 @@ window.search = window.search || {};
function init() {
resultsoptions = window.search.resultsoptions;
searchoptions = window.search.searchoptions;
searchbar_outer = window.search.searchbar_outer;
searchindex = elasticlunr.Index.load(window.search.index);
// Set up events
@ -250,6 +251,8 @@ window.search = window.search || {};
document.addEventListener('keydown', function(e) { globalKeyHandler(e); }, false);
// If the user uses the browser buttons, do the same as if a reload happened
window.onpopstate = function(e) { doSearchOrMarkFromUrl(); };
// Suppress "submit" events so the page doesn't reload when the user presses Enter
document.addEventListener('submit', function(e) { e.preventDefault(); }, false);
// If reloaded, do the search or mark again, depending on the current url parameters
doSearchOrMarkFromUrl();