Axeem
Axeem

Reputation: 191

Selecting next field on press enter using jquery

I have a html form and whenever enter is pressed the next field is selected.
here is a 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 is not working.

Upvotes: 5

Views: 1453

Answers (2)

A_funs
A_funs

Reputation: 1246

this should work no matter the 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 select:

$(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/

Upvotes: 0

user3497034
user3497034

Reputation:

Try following script

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

Demo

Upvotes: 1

Related Questions