Bootstrap-slider.js are not trigger the setValue change function programmatically

user_3049360 0
Viewed 930

I'm using bootstrap-slider.js. Everything works fine, but setting a new value with setValue does not trigger the "change" function.

HTML:

<div id="barra-temp">
    <input id="selec-temp" type="text"/>
</div>

JAVASCRIPT:

var barratemp = $("#selec-temp").slider({
        id: "slider-temp",
        min: 1500,
        max: 1850,
        tooltip: 'always',
        tooltip_split: true,
        range: true,
        formatter: function(value) {
            return 'Año: ' + value;
        }
    });
    barratemp.on('change',function(val){
        console.log('It works');
    });

CODE TO UPDATE VALUES:

$("#selec-temp").slider('setValue',[1550,1552],true);

Handlers move to the new position, but the triggerChangeEvent does not trigger.

Thank you

bootstrap-4 slider jquery javascript
1 Answers

From the Docs for setValue:

  • Parameters: newValue, triggerSlideEvent, triggerChangeEvent
  • Description:

Set a new value for the slider. If optional triggerSlideEvent parameter is true, 'slide' events will be triggered. If optional triggerChangeEvent parameter is true, 'change' events will be triggered. This function takes newValue as either a Number, String, Array. If the value is of type String it must be convertable to an integer or it will throw an error.

You are calling setValue in the following way:

$("#selec-temp").slider('setValue',[1550,1552],true);

This means that triggerSlideEvent is true, while triggerChangeEvent is false (the default). Thus no change event is triggered. Use the following instead:

$("#selec-temp").slider('setValue',[1550,1552],true,true);

user_14180490
Related