[jQuery] ajaxForm with validate plugin - doubleclick form submit issue...
Hi, I am having a strange issue with ajaxForm...this form load normally without ajax call but I use ajaxForm for form submit.
This form get submitted only on <b>double click of submit button</b>...Any idea why this behaviour?
I am using validate plugin for form validation...
Here is my code...
// prepare the form when the DOM is ready
$(document).ready(function() {
$('#password').pstrength();
$("#accountSettingForm").validate({
// validate Account Setting Form on keyup and submit
rules: {
"user.firstName": "required",
"user.lastName": "required",
"user.password": {
minlength: 6
},
"user.confirmPassword": {
minlength: 6,
equalTo: "#password"
},
"user.email": {
required: true,
email: true
},
"user.securityAnswer": {
required: true
},
"user.country.code" : {
required: true
},
"<a href="http://user.securityQuestion.id">user.securityQuestion.id</a>" : {
required: true
}
},
messages: {
"user.firstName": "Please enter your First Name",
"user.lastName": "Please enter your Last Name",
"user.password": {
minlength: "Your Password must be at least 6 characters long"
},
"user.confirmPassword": {
minlength: "Your Password must be at least 6 characters long",
equalTo: "Please enter the same Password as above"
},
"user.email": "Please enter a valid Email Address",
"user.securityAnswer": "Please answer for your Security Question",
"user.country.code" : "Please select your Country",
"<a href="http://user.securityQuestion.id">user.securityQuestion.id</a>" : "Please select your Security Question"
},
meta: "validate",
errorLabelContainer: "#jsValidationErrorMsg",
errorClass: "userError",
wrapper: "li",
submitHandler: function(form) {
// bind form using 'ajaxForm'
$(form).ajaxForm({
success: function(data,jqForm,options){
if(data.indexOf("updated successfully") > 0 || data.indexOf("profile has been updated") > 0) {
$('#serverResponseMsg').addClass("infoMsg").html(data);
}else{
$('#serverResponseMsg').addClass("userError").html(data);
}
}
});
}
});
});