supress enter keypresses in HTML input search fields

see #295
ImageMonkey · Sep 13, 2021 · 3171499 · 3171499
1 parent cbacebb
commit 3171499
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 3 deletions.
diff --git a/html/templates/explore.html b/html/templates/explore.html
@@ -244,6 +244,14 @@
     $("#query").val(randomElem);
   });
 
+  $("#query").keyup(function(event) {
+    if(event.keyCode === 13) { //when enter inside input field is pressed
+      event.preventDefault();
+      $("#goButton").click();
+      $("#query").blur();
+    }
+  });
+
   //in case there are URL parameters prodvided, load when document
   //gets loaded.
   {{if ne .queryInfo.Query "" }}
@@ -275,7 +283,7 @@ <h2>Data should be easily accessible. For Everybody.</h2>
     </div>
     <div class="row">
       <div class="eight wide center aligned column">
-        <form class="ui form segment">
+        <form class="ui form segment" onsubmit="return false;"> <!-- do not handle enter key presses in HTML form-->
           <div class="field">
             <p class="default-text">Query the data you are interested in</p>
             <div class="ui action input">

diff --git a/html/templates/modules/annotation_browse_select_mode.html b/html/templates/modules/annotation_browse_select_mode.html
@@ -410,14 +410,22 @@
       var randomElem = availableLabels[getRandomInt(0, availableLabels.length - 1)];
       $("#annotationQuery").val(randomElem);
     });
+
+    $("#annotationQuery").keyup(function(event) {
+      if(event.keyCode === 13) { //when enter inside input field is pressed
+        event.preventDefault();
+        populateImageGrid();
+        $("#annotationQuery").blur();
+      }
+    });
   });
 </script>
 
 <div class="row"></div>
 <div class="row" id="annotationQuerySearchContainer">
   <div class="four wide column"></div>
   <div class="eight wide center aligned column">
-    <form class="ui form segment">
+    <form class="ui form segment" onsubmit="return false;"> <!-- do not handle enter key presses in HTML form-->
       <div class="field">
        <p class="default-text">Search for annotation tasks you are interested in</p>
        <div class="ui action input">

diff --git a/html/templates/modules/label_browse_select_mode.html b/html/templates/modules/label_browse_select_mode.html
@@ -312,7 +312,7 @@
 <div class="row" id="labelQuerySearchContainer">
   <div class="four wide column"></div>
   <div class="eight wide center aligned column">
-    <form class="ui form segment" id="labelQueryForm">
+    <form class="ui form segment" id="labelQueryForm" onsubmit="return false;"> <!-- do not handle enter key presses in HTML form-->
       <div class="field">
        <p class="default-text">Search for images you are interested in</p>
        <div class="ui action input">