add history support about jquery-steps HOT 6 OPEN

I was able to accomplish this functionality using this Code:

$wizard = $("#wizard");
$wizard.steps({
  onStepChanged: function (event, currentIndex, priorIndex) {
    var currentStep = $("#wizard").steps("getStep", currentIndex);
    window.location.hash = currentStep.title;
  }
});


$(window).hashchange( function(){
  var hash = location.hash.replace("#", "");

  $steps = $wizard.data("steps");

  if (hash == "") {
    var firstStep = $wizard.steps("getStep", 0);
    hash = firstStep.title;
  }

  jQuery.each($steps, function (indexInArray, valueOfElement) {
    if (valueOfElement.title == hash) {

      var $currentIndex = $wizard.steps("getCurrentIndex");
      var diferrence = indexInArray - $currentIndex;

      for (var i = 0; i < diferrence; i++) {
        $wizard.steps("next");
      }

      for (var i = 0; i > diferrence; i--) {
        $wizard.steps("previous");
      }
    }
  });
});

Of course it is not well written JS, but it does the trick for the moment. How can we get this functionality into jQuery Steps?

I was missing two API methods:

$steps = $wizard.data("steps");

This doesn't seem to be the nicest to accomplish what I needed. Why not introduce a getSteps() method?

var $currentIndex = $wizard.steps("getCurrentIndex");
var diferrence = indexInArray - $currentIndex;

for (var i = 0; i < diferrence; i++) {
  $wizard.steps("next");
}

for (var i = 0; i > diferrence; i--) {
  $wizard.steps("previous");
}

This isn't nice either. The only way to navigate through steps are the next() and previous() methods. Why not have something like goToStep() which takes the desired index as a parameter?

from jquery-steps.

Hi @quasiperfect,

could you explain that a bit more and tell me what the benefit would be please!? Would be super cool ;-)

from jquery-steps.

Hi @rstaib ,

i mean to be able to use the back and forward buttons of the browser to navigate the tabs
that would meany any tab could be linkable and bookmarkable

take a look here http://benalman.com/projects/jquery-hashchange-plugin/

from jquery-steps.

Hey @quasiperfect,

now it is clear to me. Sounds great and thx for contribution! I will implement that in one of my upcoming releases. And actually, it is related to one of my next features where you could jump from any page to a specific step.

I will inform you when it is ready for use.

from jquery-steps.

hi @rstaib,

thanks for your work

from jquery-steps.

I just did a build and failed to see the desired behavior except that changing steps also changes the hash. Navigating to a specific step using a hash in the URI doesn't work.

What is missing here? Maybe I could try to contribute this.

from jquery-steps.