<head runat="server">
<title></title>
<script type="text/javascript" src="../js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('input:text:first').focus();//use $('input:text:first') selector to retrieve a handle to the first ASP.NET TextBox
$('input:text').bind("keydown", function (e) {//Use bind to attach an event handler for "keydown" event on all the TextBoxes in the form
if (e.which == 13) {//Check if the Enter key is pressed
var nextIndex = $('input:text').index(this) + 1;
if ($('input:text')[nextIndex] != null) {
e.preventDefault(); //If the Enter key is pressed, prevent default form submission
$('input:text')[nextIndex].focus();//Increment the index of the current TextBox by 1 to retrieve the handle to the immediately next TextBox on the form
}
}
})
$('#btnReset').click(function () {
$('form')[0].reset();
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:Label ID="lblName" runat="server" Text="Name:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblAddress" runat="server" Text="Address:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtAddress" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblNumber" runat="server" Text="Number:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtNumber" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblEmail" runat="server" Text="Email:"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
<asp:Button ID="btnReset" runat="server" Text="Reset" />
<input type="reset" value="reset" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
