Hi I need to modify jankoatwarpspeed’s form wizard. I needed to add a class that applies a style to visited steps as well as current step. No prob. Now I can’t get it to remove steps when you use the back button.
Code is at http://pastebin.com/YxZRDEda
Its not really a validation thing, and IMO not a good idea. But the owner of my company saw it somewhere and liked it so here we are! The idea is those waivers are terribly boring and terribly long. There needs to be something that attracts attention to the signature/radiobutton as they are required. I think the way it is, with the orange combined with validation (yet to be set up) is fine, but he wants it to change the image on the left when someone simply clicks into the text box/hits radio button. So simply put its just a change of class to the parent li when you click in the box. Ill look into the replaceClass today. Really great stuff on the form wizard.
Thanks,
Kane
Yes, i swear by it. I use it for all validation and .ajax submissions. I will use it here when I get to validation. right now Im trying to add some .click functionality to change background images, my intention was whatever they enter, just as long as they click in the box to change the message. Ill use the validation plug in to validate minLength or some similar method. or could I use a validation call back to do it? Hadn’t gotten that far, simply wanted to change the parent li’s class when you enter the textbox, wasn’t a validation type issue.
thanks again for all your help.
You have been very helpful, if you dont have more time to waste on me I totally understand. One other issue Im having right now is that on the “Exchange Agreement” Section where the inline forms are at (orange bar with “Action Required”) I want to change the class of warning (“Action Required” graphic) and replace it with class thanks (thank you graphic) when someone clicks on an input in the li. this is what I have ad it sucks. Sig is the id of one of the text inputs inputs, I know Ill have to make a function for each one so it doesn’t change all classes when one is clicked. or so I think.
works great. layout is being tweaked to give the li’s absolute positioning so I can use a graphic that has some overlap in it. I really do appreciate your help. Ive got some other issues now…much easier than these…
You will definately want to rename the variables within the selectStep function
function selectStep(i,dir) {
$('#steps li')
.removeClass('current')
.each(function (j) {
if (j <= i) {
$("#stepDesc" + j).addClass("current");
}
});
if (dir == 'prev') {
$("#stepDesc" + (i + 1)).removeClass("current");
}
}
Is that extra part relating to dir even necessary? The third line should have already removed every single class called “current” from the all of the steps.
is renaming them as simple as replacing all i’s with “foo” and all j’s with “bar” or something? as long as they are consistent? and throughout the entire script i would assume.
Now onto changing a parent li’s background image (via class) when you click on an input inside it!