From d797a3c9ecea412af7822ad24b046e20c50867cd Mon Sep 17 00:00:00 2001
From: Andreas Huber <bitbucket@lucares.de>
Date: Sat, 23 Sep 2017 12:56:32 +0200
Subject: [PATCH] send form when pressing enter

---
 .../src/main/resources/resources/js/search.js |  6 ++
 pdb-ui/src/main/resources/templates/main.html | 84 ++++++++++---------
 2 files changed, 49 insertions(+), 41 deletions(-)

diff --git a/pdb-ui/src/main/resources/resources/js/search.js b/pdb-ui/src/main/resources/resources/js/search.js
index 945d1e6..d4e4bfd 100644
--- a/pdb-ui/src/main/resources/resources/js/search.js
+++ b/pdb-ui/src/main/resources/resources/js/search.js
@@ -3,6 +3,12 @@ $(document).ready(function(){
 
 	$('#search-submit').click(plot);
 	
+	$('#search-input').keypress(function(e) {
+        if(e.which == 13) {
+            plot();
+        }
+    });
+	
 	renderGroupBy();
 	updateSearchLimitValue();
 	
diff --git a/pdb-ui/src/main/resources/templates/main.html b/pdb-ui/src/main/resources/templates/main.html
index 7b279ad..99faf32 100644
--- a/pdb-ui/src/main/resources/templates/main.html
+++ b/pdb-ui/src/main/resources/templates/main.html
@@ -20,47 +20,49 @@
 			data-autocomplete-empty-message="nothing found" />
 	</div>
 	<div id="search-bar">
-		<label for="search-group-by-1">Group By:</label> 
-		<select id="search-group-by-1"></select>
-		<select id="search-group-by-2"></select>
-		<select id="search-group-by-3"></select>
-		
-		<label for="search-limit-by">Limit By:</label>
-		<select id="search-limit-by">
-			<option value="NO_LIMIT" selected="selected">no limit</option>
-			<option value="MOST_VALUES">most values</option>
-			<option value="FEWEST_VALUES">fewest values</option>
-		</select>
-		<input type="number" id="search-limit-value" name="search-limit-value" min="1" max="1000" value="10"/>
-		
-		<label for="search-date-from">From Date:</label>
-		<input id="search-date-from" class="input_date" type="text" value="{{oldestValue}}" required="required" pattern="\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]) [0-2]\d:[0-5]\d:[0-5]\d">
-		
-		<label for="search-date-range">Interval:</label>
-		<input id="search-date-range" type="text" list="ranges" required="required" value="1 week" pattern="\d+ (second|minute|hour|day|week|month)s?">
-		<datalist id="ranges">
-			<option value="60 seconds">
-			<option value="5 minutes">
-			<option value="1 hour">
-			<option value="1 day">
-			<option value="1 week">
-			<option value="1 month">
-		</datalist>
-		
-		<label for="search-y-axis-scale">Y-Axis:</label>
-		<select id="search-y-axis-scale">
-			<option value="LINEAR" selected="selected">linear</option>
-			<option value="LOG10">log 10</option>
-			<option value="LOG2">log 2</option>
-		</select>
-		
-		<label for="show-aggregate">Aggregate:</label>
-		<select id="show-aggregate">
-			<option value="NONE" selected="selected">-</option>
-			<option value="MEAN">Mean</option>
-		</select>
-		
-		<button id="search-submit"><i class="fa fa-area-chart" aria-hidden="true"></i> Plot</button>
+		<form>
+			<label for="search-group-by-1">Group By:</label> 
+			<select id="search-group-by-1"></select>
+			<select id="search-group-by-2"></select>
+			<select id="search-group-by-3"></select>
+			
+			<label for="search-limit-by">Limit By:</label>
+			<select id="search-limit-by">
+				<option value="NO_LIMIT" selected="selected">no limit</option>
+				<option value="MOST_VALUES">most values</option>
+				<option value="FEWEST_VALUES">fewest values</option>
+			</select>
+			<input type="number" id="search-limit-value" name="search-limit-value" min="1" max="1000" value="10"/>
+			
+			<label for="search-date-from">From Date:</label>
+			<input id="search-date-from" class="input_date" type="text" value="{{oldestValue}}" required="required" pattern="\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[1-2]\d|3[0-1]) [0-2]\d:[0-5]\d:[0-5]\d">
+			
+			<label for="search-date-range">Interval:</label>
+			<input id="search-date-range" type="text" list="ranges" required="required" value="1 week" pattern="\d+ (second|minute|hour|day|week|month)s?">
+			<datalist id="ranges">
+				<option value="60 seconds">
+				<option value="5 minutes">
+				<option value="1 hour">
+				<option value="1 day">
+				<option value="1 week">
+				<option value="1 month">
+			</datalist>
+			
+			<label for="search-y-axis-scale">Y-Axis:</label>
+			<select id="search-y-axis-scale">
+				<option value="LINEAR" selected="selected">linear</option>
+				<option value="LOG10">log 10</option>
+				<option value="LOG2">log 2</option>
+			</select>
+			
+			<label for="show-aggregate">Aggregate:</label>
+			<select id="show-aggregate">
+				<option value="NONE" selected="selected">-</option>
+				<option value="MEAN">Mean</option>
+			</select>
+			
+			<button id="search-submit"><i class="fa fa-area-chart" aria-hidden="true"></i> Plot</button>
+		</form>
 	</div>
  
 	<div id="navigation">