When selecting the next field, press enter with jquery

Question

I have an html form, and whenever enter pressed, the next field is selected.
here is the code.

  $(document).on("keydown","input",function(event) { if (event.which === 13) { event.stopPropagation(); event.preventDefault(); $(this).nextAll("input").eq(0).focus(); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form> <table> <tr> <td>Medical Record No.</td><td><input type="text" name="labNo" /></td> </tr> <tr> <td>Age/sex </td><td><input type="text" name="age" /> <select id="age"> <option value="Year">Year</option> <option value="Month">Month</option> </select> <select id="sex"> <option value="Male">Male</option> <option value="Female">Female</option> </select> </td> </tr> <tr> <td>Phone </td> <td><input type="text" name="" value="-,-" /></td> </tr> <tr> <td colspan="2"><input type="button" id="patBtn" value="Save (S)" accesskey="s" /> <input type="reset" value="Set Default (D)" accesskey="d" /> </td> </tr> </table> </form> 

This does not work.

Answer 1

this should work regardless of html structure

 $(document).on("keydown","input",function(event) { if (event.which === 13 || event.keyCode === 13) { event.stopPropagation(); event.preventDefault(); var position = $(this).index('input'); $("input").eq(position+1).focus(); } }); 

also for selection:

 $(document).on("keydown, keyup","input, select",function(event) { if (event.which === 13 || event.keyCode == 13) { event.stopPropagation(); event.preventDefault(); var position = $(this).index('input, select'); $("input, select").eq(position+1).focus(); } }); 

jsfiddle: http://jsfiddle.net/xh0m7pzu/1/

Answer 2

Try to execute script

 $(document).on("keydown","input",function(event) { debugger; if (event.which === 13) { event.stopPropagation(); event.preventDefault(); $(this).parents("tr").next().find("input").focus(); } }); 

Demo