0 Replies - 832 Views - Last Post: 22 May 2012 - 03:56 PM

#1 shongale   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 1
  • Joined: 02-October 10

jQuery Wizard coding!

Posted 22 May 2012 - 03:56 PM

Being kinda of a newbie with jQuery I have been working on a Form Wizard that breaks up large forms and allows me to validate small chunks (pages) rather than the entire large form.
I want to make the code reset or refresh the form each time it is selected (start on panel1). Currently it remembers the last panel (can't figure out how it does that either) it was left at.
Here's the code: any help is absolutely appreciated.
$(function() {
    // Previous Panel	
    $("#prevreserbut").button({ icons: {primary:'ui-icon-carat-1-w'}
    }).click(function(e)
    {	// stop form submission
	e.preventDefault();
		
	// look at each panel
	$(".form-panel").each(function(i)
	{    // if it's not the last panel enable the next button
	    ($(this).attr("id") != "panel-last") ? null : $("#nextreserbut").button("enable");
					  
	    // if the panel is visible fade it out
	    ($(this).hasClass("ui-helper-hidden")) ? null : $(this).fadeOut("slow", function()
	    {	// add hidden class and show the next panel
		$(this).addClass("ui-helper-hidden").prev().fadeIn("fast", function()
		{	// if it's the first panel disable the back button
    		    ($(this).attr("id") != "panel1") ? null : $("#prevreserbut").button("disable");

		    // remove hidden class from new panel
		    $(this).removeClass("ui-helper-hidden");
		});
	    });
	});
	return false;
    });	



	// Next Panel
	$("#nextreserbut").button({ icons: {secondary:'ui-icon-carat-1-e'}
	}).click(function(e)
	{    // stop form submission
	    e.preventDefault();
	
	    // look at each panel
	    $(".form-panel").each(function(i)
	    {	// if it's not the first panel enable the back button
                //$(this).attr("id", "panel" + i);
        	($(this).attr("id") != "panel1") ? null : $("#prevreserbut").button("enable");

		// if the panel is visible fade it out
  		($(this).hasClass("ui-helper-hidden")) ? null : $(this).fadeOut("slow", function()
		{   // add hidden class and show the next panel
		    $(this).addClass("ui-helper-hidden").next().fadeIn("fast", function()
		    {	// if it's the last panel disable the next button
		        ($(this).attr("id") != "panel-last") ? null : $("#nextreserbut").button("disable");

			// remove hidden class from new panel
			$(this).removeClass("ui-helper-hidden");
	        });
	    });
	});
        return false;
    });
});


Please help. Also if anyone can tell me why jQuery fails miserably in SeaMonkey??
Thanks much!

This post has been edited by macosxnerd101: 22 May 2012 - 04:00 PM
Reason for edit:: Fixed code tags


Is This A Good Question/Topic? 0
  • +

Page 1 of 1