IonDen / ion.rangeSlider

jQuery only range slider
http://ionden.com/a/plugins/ion.rangeSlider/en.html
MIT License
2.56k stars 508 forks source link

Reset slider on Ajax form submission #588

Closed CodeCurosity closed 4 years ago

CodeCurosity commented 5 years ago

how can we reset the slider to its original predefined values on ajax form submission?

I am resetting my form with a trigger, it resets all other fields but range slider.

jQuery('.form').trigger("reset");

IonDen commented 5 years ago

Hi, you can't reset it like this. You should manually call sliders reset() method. Like this:

var $slider = $(".form").find(".js-range"); // replace js-range with your class name
var slider_instance = $slider.data("ionRangeSlider");
slider_instance.reset();
CodeCurosity commented 5 years ago

It works perfectly if you have single slider instance, how do we reset if there are multiple?

CodeCurosity commented 5 years ago

Figured it out, hope this helps others.

var sliders = $(".form").find(".range_slider");
         jQuery(sliders).each(function(index,slider){
             var slider_instance = jQuery(slider).data("ionRangeSlider");
             slider_instance.reset();
          });
carmadrazo commented 4 years ago

Figured it out, hope this helps others.

var sliders = $(".form").find(".range_slider");
         jQuery(sliders).each(function(index,slider){
             var slider_instance = jQuery(slider).data("ionRangeSlider");
             slider_instance.reset();
          });

Thanks for your reply, it helped me solve this problem too :) Based on that I decided to do a for loop instead of a .each (I feel more comfortable with that) and run it in every element with the class associated with the slider. Here it goes:

var num=$(".js-range-slider").length; for(var i=0;i<num;i++){ var sliderFromTo=$(".js-range-slider:eq("+i+")").data("ionRangeSlider"); sliderFromTo.reset(); }