Can I programmatically hide a step in jWizard?

Question

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

1. Choose configuration
2. Configuration of A
3. Configuration of B
4. Summary page

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.

Answer 1

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.

Ask first

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.

Put A & B on one Page and hide the ones you don't need

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();
         }
     });

Write the logic yourself

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).

Answer 2

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.