So I have a form with a few text boxes on them. I'm having a issue where hitting the enter key (used as tab in this scenario) is causing the next text field that the user lands on to be validated. This by the way only happens in FF and it only happens with
the first field.
Here's the jquery:
function getNextElement(field) {
var form = field.form;
for (var e = 0; e < form.elements.length; e++) {
if (field == form.elements[e]) {
break;
}
}
return form.elements[++e % form.elements.length];
}
function tabOnEnter(field, evt) {
if (evt.keyCode === 13) {
if (evt.preventDefault) {
evt.preventDefault();
} else if (evt.stopPropagation) {
evt.stopPropagation();
} else {
evt.returnValue = false;
}
getNextElement(field).focus();
return false;
} else {
return true;
}
}
And in the code behind I'm adding the onkeydown event like so:
txtFirstName.Attributes.Add("onKeyDown", "return tabOnEnter(this,event)");
txtLastName.Attributes.Add("onKeyDown", "return tabOnEnter(this,event)");
And finally on the page I've added the controls.
<asp:Label ID="lblFirstName" AssociatedControlID="txtFirstName" runat="server">First Name</asp:Label>
<asp:TextBox ID="txtFirstName" runat="server"TabIndex="1"></asp:TextBox>
<asp:RequiredFieldValidator ID="RFVFirstName" ValidationGroup="Login" Display="Dynamic" runat="server" ErrorMessage="Required" ControlToValidate="txtFirstName"></asp:RequiredFieldValidator>
<asp:Label ID="lblLastName" runat="server">Last Name</asp:Label>
<asp:TextBox ID="txtLastName" runat="server" TabIndex="2"></asp:TextBox>
<asp:RequiredFieldValidator ID="RFVLastName" ValidationGroup="Login" Display="Dynamic" runat="server" ErrorMessage="Required" ControlToValidate="txtLastName"></asp:RequiredFieldValidator>
As stated using this example once you hit enter and advance to the second text field the RFVLastName is being executed in FF and I want this to stop. Any insight or advice would be greatly appreciated. Thanks.