jquery - Interactive / Reactive change of min / max values of 'Ion Range Slider' -

i trying make reactive range slider. have dropdown list in have range. whenever dropdown change automatically change range of range sidebar.

=========template helpers code ================

$("#ionrange_1").ionrangeslider({         min: session.get('min'),         max: session.get('max'),         type: 'double',         prefix: "$",         maxpostfix: "+",         prettify: false,         hasgrid: true     }); 

=========================================

i try 1 in template helper.

define range slider in template rendered.

var slider = $("#ionrange_1").data("ionrangeslider");  slider.reset();  $("#ionrange_1").ionrangeslider({             min: session.get('min'),             max: session.get('max'),             type: 'double',             prefix: "$",             maxpostfix: "+",             prettify: false,             hasgrid: true         }); 

you need wrap code on template rendered function autorun. moreover, should use a reactive variable instead of session variable

try this:

var self = this; self.autorun(function() {      var slider = $("#ionrange_1").data("ionrangeslider");      slider.reset();      $("#ionrange_1").ionrangeslider({                 min: self.min.get(),                 max: self.max.get(),                 type: 'double',                 prefix: "$",                 maxpostfix: "+",                 prettify: false,                 hasgrid: true             });  }; 

each time update reactive var, code should excecuted (and slider max/min values updated).

you need consider storing current value reactive variable in order set once have reloaded slider.