I'm trying to use the jQuery validation plugin (from here -->http://bassistance.de/jquery-plugins/jquery-plugin-validation/
) to programmatically validate fields in certain sections of a page based on a button click (not a true form submission until the end the final section where it will validate the entire form) prior to proceeding to a new section. Essentially when you click a button in a particular section, the fields in that section need to开发者_Go百科 validate. The first section of the page validates just fine, but when I get to the second section, it just proceeds right through without validating. What is the proper way to do this? Am I at least on the right track??
// Step 1 section validation
var validateStep1 = $("#form1").validate({
errorClass: "warning",
onkeyup: false,
onblur: false,
onfocusout: true,
rules: {
"field1": {
required: true,
},
"field2": {
required: true,
minlength: 1
},
"field3": {
required: true,
}
}
});
// Step 2 section validation
var validateStep2 = $("#form1").validate({
errorClass: "warning",
onkeyup: false,
onblur: false,
onfocusout: true,
rules: {
"field4": {
required: true,
},
"field5": {
required: true,
},
"field6": {
required: true,
}
}
});
// click events for buttons to proceed
$("#button1").click( function() {
if (validateStep1.form()) {
// proceed
}
});
$("#button2").click( function() {
if (validateStep2.form()) {
// proceed
}
});
Thanks in advance for your help!
I guess you cannot use two times differently the 'validate' method on the same form.
What you could use is the "depends" option on the rules objects. It allows to 'apply' the rule only based on the result of the "depends".
There is an example on this page: http://rocketsquared.com/wiki/Plugins/Validation/validate#toptions (go to the 'rules' documentation section)
$(".selector").validate({
rules: {
contact: {
required: true,
email: {
depends: function(element) {
return $("#contactform_email:checked")
}
}
}
}
});
Hope this helps, d.
精彩评论