*Visithttp://www.dynamicdrive.com/ for full source code
*/
//Oct 21st, 2010: Script updated to v1.1, which adds basic form validation functionality, triggered each time the user goes from one page to the next, or tries to submit the form.
createfieldsets:function($theform,arr){//reserved function for future version (dynamically wraps form elements with a fieldset element)
$theform.find('fieldset.sectionwrap').removeClass('sectionwrap')//make sure no fieldsets carry 'sectionwrap' before proceeding
var$startelement=$theform.find(':first-child')//reference first element inside form
for(vari=0;i<arr.length;i++){//loop thru "break" elements
var$fieldsetelements=$startelement.nextUntil('#'+arr[i].breakafter+', *[name='+arr[i].breakafter+']').andSelf()//reference all elements from start element to break element (nextUntil() is jQuery 1.4 function)
$fieldsetelements.add($fieldsetelements.next()).wrapAll('<fieldset class="sectionwrap" />')//wrap these elements with fieldset element
$startelement=$theform.find('fieldset.sectionwrap').eq(i).prepend('<legend class="legendStep">'+arr[i].legend+'</legend>').next()//increment startelement to begin at the end of the just inserted fieldset element
}
},
loadsection:function(rawi,bypasshooks){
varthiswizard=this
//doload Boolean checks to see whether to load next section (true if bypasshooks param is true or onpagechangestart() event handler doesn't return false)
doload=(doload===false)?false:true//unless doload is explicitly false, set to true
if(!bypasshooks&&this.setting.validate){
varoutcome=this.validate(this.currentsection)
if(outcome===false)
doload=false
}
vari=(rawi=="prev")?this.currentsection-1:(rawi=="next")?this.currentsection+1:parseInt(rawi)//get index of next section to show
i=(i<0)?this.sections.count-1:(i>this.sections.count-1)?0:i//make sure i doesn't exceed min/max limit
if(i<this.sections.count&&doload){//if next section to show isn't the same as the current section shown
this.$thesteps.eq(this.currentsection).addClass('disabledstep').end().eq(i).removeClass('disabledstep')//dull current "step" text then highlight next "step" text
this.sections.$outerwrapper.stop().animate({height:this.sections.$sections.eq(i).outerHeight()},this.setting.revealfx[1])//animate fieldset wrapper's height to accomodate next section's height
this.sections.$innerwrapper.stop().animate({left:-i*this.maxfieldsetwidth},this.setting.revealfx[1],function(){//slide next section into view
var$stepsguide=$('<div class="stepsguide" />')//create Steps Container to house the "steps" text
var$sections=$theform.find('fieldset.sectionwrap').hide()//find all fieldset elements within form and hide them initially
if(setting.revealfx[0]=="slide"){//create outer DIV that will house all the fieldset.sectionwrap elements
$sectionswrapper=$('<div style="position:relative;overflow:hidden;"></div>').insertBefore($sections.eq(0))//add DIV above the first fieldset.sectionwrap element
$sectionswrapper_inner=$('<div style="position:absolute;left:0;top:0;"></div>')//create inner DIV of $sectionswrapper that will scroll to reveal a fieldset element
}
varmaxfieldsetwidth=$sections.eq(0).outerWidth()//variable to get width of widest fieldset.sectionwrap
$sections.slice(1).each(function(i){//loop through $sections (starting from 2nd one)
maxfieldsetwidth+=2//add 2px to final width to reveal fieldset border (if not removed via CSS)
thiswizard.maxfieldsetwidth=maxfieldsetwidth
$sections.each(function(i){//loop through $sections again
var$section=$(this)
if(setting.revealfx[0]=="slide"){
$section.data('page',i).css({position:'absolute',top:0,left:maxfieldsetwidth*i}).appendTo($sectionswrapper_inner)//set fieldset position to "absolute" and move it to inside sectionswrapper_inner DIV
}
$section.data('elements',[])//empty array to contain elements within this section that should be validated for data (applicable only if validate option is defined)
//create each "step" DIV and add it to main Steps Container:
thiswizard.sections={$outerwrapper:$sectionswrapper,$innerwrapper:$sectionswrapper_inner,$sections:$sections,count:$sections.length}//remember various parts of section container
thiswizard.sections.$sections.show()
}
else{
thiswizard.sections={$sections:$sections,count:$sections.length}//remember various parts of section container
}
thiswizard.$thesteps=$thesteps//remember this ref
thiswizard.paginatediv={$main:$paginatediv,$navlinks:$paginatediv.find('span.prev, span.next'),$status:$paginatediv.find('span.status')}//remember various parts of pagination DIV
thiswizard.paginatediv.$main.click(function(e){//assign behavior to pagination buttons
