smart - jquery steps reset wizard

Ir a un paso personalizado con jQuery-steps

Question

Estoy usando jQuery-steps en mi aplicación para una situación de tipo asistente. Sin embargo, estoy teniendo problemas para descubrir cómo cambiar a un paso personalizado. ¿Alguna ayuda con esto?

$(function () {
    $("#wizard").steps({
        headerTag: "h2",
        bodyTag: "section",
        transitionEffect: "slideLeft",
        enableFinishButton: false,
        labels: {
            next: $(''#next'').html(),
            previous : $(''#previous'').html()

        },
        onStepChanged: function (event, currentIndex, priorIndex)
        {
            if( priorIndex == 0) {
                var selected = $(''input[name=radio_wizard]:checked'', ''#radio_wizard'').val()
                switch( selected ){
                    case 1:
                        // GOTO 1 
                        break;
                    case 2:
                        // GOTO 2 
                        break;
                    case 3:
                        // GOTO 3 
                        break;
                }
            }
      }
}

¿Cómo lograr esto?

Answer 1

Agregando a la respuesta anterior por @FernandoTholl, para aclarar, wizard.steps("setStep", 1); entra onStepChanged

$(''#wizard'').steps({
  onStepChanging: function (event, currentIndex, newIndex) {
      //blah, blah, blah, some code here
  },
  onStepChanged: function (event, currentIndex, newIndex) {
    $(''#wizard'').steps("setStep", 3);
  },
  onFinished: function () {
      ///more code
  }
});

Answer 2

Basándome en la respuesta de @AbdulJamal, lo he implementado para cualquier paso:

$(function () {
    var stepsWizard = $("#wizard").steps({
        ...
    });

    // step variable handles current step (from 0)
    for(var i=0; i<step; i++) {
        stepsWizard.steps("next");
    }
});

Tenga en cuenta que la variable de step debe estar definida e igual o mayor que 0.

Answer 3

Creado esta nueva función:

function _goToStep(wizard, options, state, index)
{
    return paginationClick(wizard, options, state, index);
}
And the call that is not implemented, put this:

Llamada que no esta implementada, pon esto:

$.fn.steps.setStep = function (step)
{

    var options = getOptions(this),
        state = getState(this);

    return _goToStep(this, options, state, index); //Index Instead step

};

wizard.steps("setStep", 1);

funciona bien

Answer 4

He encontrado una forma sencilla de hacer esto. puedes usar la función jquery

$("#wizard-t-2").get(0).click();

asumiendo que sabes a qué paso quieres ir. este ejemplo lo llevaría al tercer paso del asistente. use el editor de chromes para averiguar cuál es la identificación exacta del paso al que desea ir.

Answer 5

Hice algo como abajo para que funcione:

stepsWizard = $("#wizard").steps({
    headerTag: "h2",
    bodyTag: "section"
});

var indx = 3;
for (i = 0; i <= indx; i++) {
 stepsWizard.steps("next");
}

Answer 6

Hice esto, así que creé esta nueva función:

function _goToStep(wizard, options, state, index)
{
    return paginationClick(wizard, options, state, index);
}

Y la llamada que no está implementada, pon esto:

$.fn.steps.setStep = function (step)
{

    var options = getOptions(this),
        state = getState(this);

    return _goToStep(this, options, state, step);

};

Solo aprovechando lo que ya existía del plugin.

Utilizar:

wizard.steps("setStep", 1);

Answer 7

Otra solución simple:

var desiredStep = 0;
$("#steps-uid-0-t-" + desiredStep).click();

Answer 8

Revisa mi siguiente implementación, ¿Qué piensas chicos?

$.fn.steps.setStep = function (step)
{
  var currentIndex = $(this).steps(''getCurrentIndex'');
  for(var i = 0; i < Math.abs(step - currentIndex); i++){
    if(step > currentIndex) {
      $(this).steps(''next'');
    }
    else{
      $(this).steps(''previous'');
    }
  } 
};

Y puedes ejecutar el nuevo método muy fácil:

$("#form").steps("setStep", 4); //based on 0 (set the index)

Saludos, Nicholls

Answer 9

Según la documentation , parece carecer de esa funcionalidad a partir de ahora:

/*  
 * Sets a specific step object by index.  
 *  
 * @method setStep  
 * @param index {Integer} An integer that belongs to the position of a step  
 * @param step {Object} The step object to change  
 *
 */
$.fn.steps.setStep = function (index, step) 
{
    throw new Error("Not yet implemented!"); 
};

Answer 10

stepsWizard = $("#wizard").steps({
        forceMoveForward : true,
        enablePagination: false,
        titleTemplate : ''<span class="number">#index#.</span> #title#''
    });

stepsWizard.steps("next"); // this will send us on next step :-)

Answer 11

function GotoSpecificStep(action, currentStep, number) {
    try
    {
        var stepsTogo = parseInt(currentStep) - parseInt(number);
        for (i = 1; i <= Math.abs(parseInt(stepsTogo)) ; i++) {
            if (action == "next") {
                $(".btnNext").click();
            }
            else if (action == "prev") {
                $(".btnPrevious").click();
            }
        }
    }
    catch(exception)
    {
        MsgBox(exception.message);
    }
}