1

I'm using jQuery SmartWizard 3.3.1 in my project. I have 5 steps and I want to make all the steps enable(class="done" isdone="1") in every state. I try to do that using below HTML code, I already tried this answer.

...
 <a href="#step-4" rel="4" class="done" isdone="1"></a>
 <a href="#step-5" rel="5" class="done" isdone="1"></a>
...

enter image description here

after page load it changes to class="disabled" isdone="0" and make the wizard not traversal without going the steps one by one. I went through the documentation and could not find the relevant information to make this happen. Is there any way that we can achieve this by smart-wizard config? or else what is the best way to solve this issue?

My smartwizard int is below:

function init_SmartWizard() {
    "undefined" != typeof $.fn.smartWizard && (console.log("init_SmartWizard"), $("#wizard").smartWizard(), $("#wizard_verticle").smartWizard({
        transitionEffect: "slide",
        enableAllSteps: true,
        anchorClickable         :   true, // Enable/Disable anchor navigation
        enableAllAnchors        :   true, // Activates all anchors clickable all times
        markDoneStep            :   true, // add done css
        enableAnchorOnDoneStep  :   true // Enable/Disable the done steps navigation
    }), $(".buttonNext").addClass("btn btn-success"), $(".buttonPrevious").addClass("btn btn-primary"), $(".buttonFinish").addClass("btn btn-default"))
}
tk_
  • 16,415
  • 8
  • 80
  • 90
  • I can't find some of the config parameters in the [documentation](https://github.com/mstratman/jQuery-Smart-Wizard) such as markDoneStep Maybe a more recent version will allow you to do what you need. It seems markDoneStep would set those classes for you (as in the description you posted) so leaving that out might help or using a more recent version. – HMR Jan 29 '18 at 04:34

1 Answers1

3

I had the same issue, the fix should be grouping the anchor settings like this:

$('#smartwizard').smartWizard({
      anchorSettings: {
          anchorClickable: true, // Enable/Disable anchor navigation
          enableAllAnchors: true, // Activates all anchors clickable all times
          markDoneStep: true, // add done css
          enableAnchorOnDoneStep: true // Enable/Disable the done steps navigation
     },
});

This makes it possible to click any header. It did not change them from the grayed out state though.

Wubbler
  • 127
  • 1
  • 3
  • 12
  • 1
    Looks like "markDoneStep: true" expects the wizard to start on the last step, then it'll mark all of them done. If you want to start on a different step, run this afterwards to change them from the grayed out state: $('#wizard .step-anchor li:not(.active)').addClass("done"); Also, "enableAllAnchors: true" combined with the above was sufficient. – MikeTV Mar 11 '19 at 18:01
  • @MikeTV addClass() did the trick for me. Just setting anchorSettings wasn't good enough. – NoBullMan May 27 '20 at 18:56