Bootstrap Slider change value handler

Question

I'm using Bootstrap Slider, and I was wondering if there is any way to include a handler for a value change. I see that the documentation includes handlers for slideStart, slide and slideStop, but none for "change" (of value).

It's possible that they could slide the slider around and (upon release) end up on the same value, in which case I would NOT want the event to fire. Only if they slide it to a new value.

I've tried:

$('#sliderAdminType').slider({
    formater: function(value) {
        // my formater stuff that works
        },
    change: function(event, ui) {
        console.log("has changed");
        }       
    });

and

$('#sliderAdminType').change(function() {
    console.log("has changed");
});

and

$('#sliderAdminType').slider().change(function() {
    console.log("has changed");
});

and

$('body').on('change', '#sliderAdminType', function(e){
    console.log("has changed");
});

Answer 1

You can do the following steps:

1) Use slideStart event to get the original value of your slider

2) Use slideStop event to get the new value of your slider

3) Compare this two value, if it's different then fire your code

var originalVal;

$('.span2').slider().on('slideStart', function(ev){
    originalVal = $('.span2').data('slider').getValue();
});

$('.span2').slider().on('slideStop', function(ev){
    var newVal = $('.span2').data('slider').getValue();
    if(originalVal != newVal) {
        alert('Value Changed!');
    }
});

Fiddle Demo