I am using the jWizard jQuery plugin to implement a wizard in my application.
Standing on my requirements I have a total of four steps in the wizard
In the first step (Choose Configuration) I simply have two check boxes which the user can mark as checked. Every check box stands for a Configuration. The user can then select one or both of them. So, for example, if the user just select the "configuration A" check box I need to hide step 3 from the wizard. In the same case, if the user check both the boxes, I need to show first stepp 2 and then step 3 of the wizard.
Is there any way to achieve this behaviour with the jWizard plugin?
Thanks very much for helping.
As mentioned in the other answer, there is not currently a way to do this using the normal functions of jWizard. So, if you need to do this you'll have to implement it yourself. You have a few options.
One option is you could ask them to select A and/or B before you launch the wizard, and launch one of three different wizards (A & B, A, B) based on this. You could also remove the step elements from the DOM before launching the wizard.
Merge step 2 and 3. Then, based on your selection in step 1, use jQuery to hide/show sections A and B in what is now step 2:
$('#checkboxa').click(function () {
var $this = $(this);
if ($this.is(':checked')) {
$('#sectiona').hide();
} else {
$('#sectiona').show();
}
});
I wish I could give you a better answer on this, since it seems to be what you're looking for, but it's hard to tell how to accomplish this from the jWizard documentation. You could try removing a step altogether from the wizard (and reinserting it if the user changes his or her mind) or manually 'skip' a step by triggering a next
event (or a click
event if no next
events are available).
Feature you are looking for is yet to be implemented. BTW, I'm waiting for that feature too.
As for now the framework simply collects all the steps during construction phase:
/**
* Initializes the step collection.
*
* Any direct children <div> (with a title or data-jwizard-title attr)
* or <fieldset> (with a <legend>) are considered steps, and there should
* be no other sibling elements.
*
* Lastly, a <div class"jw-steps-wrap"> is wrapped around all the steps to
* isolate them from the rest of the widget.
*/
_buildSteps: function () {
I didn't notice any way to manage that collection. So let's home that functionality will come up soon.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With