jQuery Steps - reset wizard without page reload

前端 未结 5 2150
攒了一身酷
攒了一身酷 2021-02-15 12:05

I am using jQuery steps ( https://github.com/rstaib/jquery-steps/wiki ) in order to create step by step form to users to fill out. It works great, however I need to be able to r

相关标签:
5条回答
  • 2021-02-15 12:44

    You can paste this:

    $.fn.steps.reset = function () {
      var wizard = this,
      options = getOptions(this),
      state = getState(this);
      goToStep(wizard, options, state, 0);
    
      for (i = 1; i < state.stepCount; i++) {
        var stepAnchor = getStepAnchor(wizard, i);
        stepAnchor.parent().removeClass("done")._enableAria(false);
      }
    };
    

    in the jquery.steps.js file right after this code:

    $.fn.steps = function (method)
    {
        if ($.fn.steps[method])
        {
            return $.fn.steps[method].apply(this, Array.prototype.slice.call(arguments, 1));
        }
        else if (typeof method === "object" || !method)
        {
            return initialize.apply(this, arguments);
        }
        else
        {
            $.error("Method " + method + " does not exist on jQuery.steps");
        }
    };
    

    and call it like this wherever you want: $('myjquerystepmodal').steps("reset");

    0 讨论(0)
  • 2021-02-15 12:48

    a small correction with the custom reset function :

    $.fn.steps.reset = function () {
    var wizard = this,
    options = getOptions(this),
    state = getState(this);
    
    if(state.currentIndex>0)
    {
        goToStep(wizard, options, state, 0);   
    
        for (i = 1; i < state.stepCount; i++) {
        var stepAnchor = getStepAnchor(wizard, i);
        stepAnchor.parent().removeClass("done")._enableAria(false);
        }
    }
    };
    

    I added a if, in case you try to reset at step 0.

    0 讨论(0)
  • 2021-02-15 13:00
    You can user this function after submitting your form:
    
    function resetForm(id_form){
        $("#" + id_form).find('input[type="text"]').val('');
        $("#" + id_form).find('input[type="password"]').val('');
        $("#" + id_form).find('input[type="checkbox"]').removeAttr("checked");
        $("#" + id_form).find('select option').removeAttr("selected");
        $("#" + id_form).find('textarea').val('');
    }
    
    Best regards!
    
    0 讨论(0)
  • 2021-02-15 13:01

    I was able to reset my jQuery steps wizard by adding a few lines of code to the solution here, plus a couple extra lines of code to remove the css classes. You'll still need to reset your form using your preferred library before or after calling this function.

    $.fn.steps.reset = function () {
      var wizard = this,
      options = getOptions(this),
      state = getState(this);
      goToStep(wizard, options, state, 0);
    
      for (i = 1; i < state.stepCount; i++) {
        var stepAnchor = getStepAnchor(wizard, i);
        stepAnchor.parent().removeClass("done")._enableAria(false);
      }
    };
    
    0 讨论(0)
  • 2021-02-15 13:06

    You can use jQuery Form Plugin , Resetting or clearing your form is then very Easy

    $('#myFormId').resetForm();
    

    Or

    $('#myFormId').clearForm();
    

    Or only Special Fields

    $('#myFormId .specialFields').clearFields();
    
    0 讨论(0)
提交回复
热议问题