I have query how to validate multiple step form, i create a form and it has a three sections in a same page,
1.Personal Info, 2.Contact info, 3.Conformation details. My question is:
If these specific inputs of step1 are all valid and return “true” in #Form, the step-two button will (b开发者_如何学Ce activated/take you to the next step) and similarly wth step 2 if all specific input are all valid and return true the step3 will activate
how to validate form in steps when i am using jquery validation
my code is here:
$(document).ready(function() {
var navHTML = '' + ''; $(function(){
// init
$('#Form > div')
.hide()
.append(navHTML);
$('#first-step .prev-als').remove();
$('#last-step .form-next').remove();
// show first step
$('#first-step').show();
$("a.form-next").click(function() {
var whichStep = $(this).parent().parent().attr('id');
if( whichStep == 'first-step' )
{
$("#first-step").validate();
if($("#form").valid()==false) return false;
//Dont navigate to second page
}
else if( whichStep == 'second-step' )
{
}
else if( whichStep == 'last-step' )
{
// validate last-step
}
$(this).parent().parent().hide().next().show(); });
$('a.prev-als ').click(function(){
$(this).parent().parent().hide().prev().show();
});
});
});
If you want to do this in the browser, consider using the jQuery Wizard Plugin located here: http://worcesterwideweb.com/2007/06/04/jquery-wizard-plugin/
A demo of the plugin in action can be found here: http://worcesterwideweb.com/jquery/wizard/
精彩评论