Jquery validation stops page submit when no field is required empty
I am using jquery to validate asp.net form (content on main page). Mandatory field validation all works fine, but I have a field not , but if it has text, it must be in the correct format. Jquery checks for incorrect text just thin, but when the text is empty, it stops submitting the form (no error message appears). Does anyone have an idea why this might be happening or what to do about it?
// Add validation rule for email
if ($("input[id$='TextBoxEmail']").length) {
$("input[id$='TextBoxEmail']").rules('add', {
required: false,
email: true,
messages: {
email: 'Please enter a valid email.'
}
});
}
a source to share
We found that a workaround for this was to manually remove the check based on our criteria.
// Add validation rule for first name (default Person type is Individual so the validation is needed as default)
if ($("input[id$='TextBoxFirstName']").length) {
$("input[id$='TextBoxFirstName']").rules('add', {
required: true,
messages: {
required: 'First Name is required for individuals.'
}
});
}
// Add event for checking if first name validation is needed
$('select[id$=DropDownListPersonType]').change(function () {
if ($('select[id$=DropDownListPersonType] option:selected').text() == 'Individual') {
// Add validation rule
$("input[id$='TextBoxFirstName']").rules('add', {
required: true,
messages: {
email: 'First Name is required for individuals.'
}
});
}
else {
// remove rule
$("input[id$='TextBoxFirstName']").rules("remove");
}
});
a source to share
I just set up a similar test and cannot replicate the problem (see code below):
<script type="text/javascript">
$(document).ready(function () {
$("#test").validate();
if ($("input[id$='txtText']").length) {
$("input[id$='txtText']").rules('add', {
required: false,
email: true,
messages: {
email: 'Please enter a valid email.'
}
});
}
});
</script>
<form id="test">
<input type="text" id="txtText" />
<input type="submit" />
</form>
I am using jQuery 1.5.1 and latest jquery.validate.min.js
I can only assume that you are making the jQuery selector more specific because it id$='TextBoxEmail'
means it ends with "TextBoxEmail". Could this be a problem if you have conflicting field names?
a source to share