Make a proper search form!

1 files changed, 20 insertions, 9 deletions

diff --git a/search.html b/search.html
index fe400ce..2768f1a 100644
--- a/search.html
+++ b/search.html
@@ -10,10 +10,12 @@ lang: "en"
 <script src="/assets/js/lunr.min.js"></script>
 <script src="/assets/js/search.js"></script>
 
-<p>
-<input id="input_qterm"></input>
-<button id="qsubmit">Search</button>
-</p>
+<form id="searchForm">
+  <p>
+    <input id="input_qterm" type="text">
+    <button id="qsubmit" type="submit">Search</button>
+  </p>
+</form>
 
 <h2>Results for <span id="qterm"></span></h1>
 <div id="results">
@@ -45,10 +47,19 @@ lang: "en"
       }
       document.getElementById("qterm").textContent = queryterm;
   }
-  document.getElementById("qsubmit").onclick = function(ev) {
-      const qbox = document.getElementById("input_qterm").value;
-      if (qbox.length !== 0) {
-          query(qbox);
-      }
+
+  // Function to be called on submit
+  function submitSearch() {
+    console.log("Search submitted");
+    const qbox = document.getElementById("input_qterm").value;
+    if (qbox.length !== 0) {
+      query(qbox);
+    }
+  }
+
+  // Attach event handler to form submission
+  document.getElementById("searchForm").onsubmit = function(ev) {
+    ev.preventDefault(); // Prevent default form submission behavior
+    submitSearch();
   };
 </script>