Tutorial :HTML Form - Firing the form submit using the enter key does not work when focus is on a select list


I'm stuck on the above problem. I have a simple form as follows, with a text input, a select list and a submit button. When focus is on the text input and I hit Enter, the form submits. If focus is on the select list the submit does not fire. I want the form to submit regardless of which field has focus.

<html>  <head runat="server">      <title></title>  </head>  <body>      <form id="form1" runat="server">      <div>          <input id='text1'/>          <select>              <option value="volvo">Volvo</option>              <option value="saab">Saab</option>              <option value="mercedes">Mercedes</option>              <option value="audi">Audi</option>          </select>          <input type='submit' onclick='alert("you submitted the form")'/>      </div>      </form>  </body>  </html>  


It's normal browser behaviour, to select an option with enter.

What you can do is attach a listener to the keyDown event of the select element and submit the form when the user pressed enter. For example. with jQuery:

$('#your-select').keydown(function(e){      if (e.keyCode == 13) {        $('#your-form').submit();      } });  

You should consider that it breaks the standards and would cause a problem for users navigating with keyboard.


firefox does this by default, for ie you need some type of javascript function cause IE binds the submit on enter only to inputs.

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »