MDB Jquery - Linear Stepper - Reset function

224 Views Asked by At

In my project I use MaterialDesignBootstrap. I really like the stepper in there, but the problem is, i cannot reset it after form submit. I use the mdbStepper function for init.

$('.stepper').mdbStepper();

I cannot find any reset() function or something similar. Maybe anyone have some advice for me. last chance would be to write a function, but I didn't have the time for that.

1

There are 1 best solutions below

0
On

I found the solution by my self.

(function( $ ){
            $.fn.resetStepper = function() {
                /* Get MDB Stepper */
                var myStepper = this;
                /* Get Steps */
                var mySteps = myStepper.find("li");

                /* Loop Steps */
                $( mySteps ).each(function( index ) {
                    /* Step Element */
                    var stepElement = this;
                    var stepContent = $(stepElement).find(".step-new-content");

                    /* if Element has Class step */
                    if ($(stepElement).hasClass("step")){
                        /* Select First Element */
                        if (index === 0 || index === "0"){
                            $(stepElement).removeClass("wrong").removeClass("done").addClass("active");
                            $(stepContent).css("display","block");
                        }else{
                            $(stepElement).removeClass("wrong").removeClass("done").removeClass("active");
                            $(stepContent).css("display","none");
                        }
                        /* Reset Inputs */
                        var inputs = $(stepContent).find("input");
                        $(inputs).each(function (index){
                           var myInput = this;
                           $(myInput).val("");
                        });
                    }

                });
            };
        })( jQuery );

Then call

$("#postingAddStepper").resetStepper();