I am encountering an issue with my ASP.NET 4.0 form where I have multiple textboxes within divs that are dynamically shown or hidden. Specifically, I have a textbox with an onkeypress event defined as follows:
<fieldset>
<div class="WizardStepDiv">
<label for="MobileNumber">
Please enter your mobile number</label>
<input type="text" name="vmobilenumber" id="vmobilenumber" runat="server" style="width: 150px"
onkeypress="javascript: return searchKeyPress(event);" />
</div>
<div class="navigationArrows">
<div style="margin-left: 35%; width: 165px;">
<div class="previousbutton" style="float: left; padding: 3px 0 0 6px">
<a href="#" onclick="NavigatetoPreviousScreen()">
<img src="image/left_arrow.png" width="18" height="25" alt="navigateprevious" />
</a>
</div>
<div class="nextbutton" style="float: right; padding: 3px 0 0 6px">
<a href="#" id="searchMobileNumber" onclick="NavigatetoNextScreen()">
<img src="image/right_arrow.png" width="18" height="25" alt="navigatenext" />
</a>
</div>
</div>
</div>
</fieldset>
The searchKeyPress(event) function has a specific behavior coded as follows:
function searchKeyPress(e) {
if (typeof e == 'undefined' && window.event) { e = window.event; }
if (e.keyCode == 13) {
document.getElementById('searchMobileNumber').click();
if (e.stopPropagation) {
e.stopPropagation();
} else {
e.cancelBubble = true;
}
(event.preventDefault) ? event.preventDefault() : event.returnValue = false;
}
}
The NavigatetoNextScreen() function is responsible for validating the mobile number textbox. If validation passes, it triggers an ajax call as shown below:
var mobilenumber = $.trim($("#vmobilenumber").val());
if (mobilenumber == "" || !isNumber(mobilenumber)) {
error += "<span>Please enter a valid mobile number to proceed to the next step</span></br>";
}
if (error == "") {
$("#errormessage").hide();
methodName = "GetVistorByMobileNumber";
$.support.cors = true;
$.ajax({
type: 'GET',
// Additional AJAX call parameters
});
However, I am experiencing an unwanted page postback specifically in Firefox, Chrome, and IE after the ajax call returns success or error. This behavior does not occur in other browsers. Any ideas on what might be causing this issue?
Thank you for your assistance.