add handlers to Jquery UI slider

Question

Is there a way to add handler to UI slider after initialization?

now i do:

var values = [0,50,100];
sliderbox.slider({
    values : values,
    min : 0,
    max : 100
});

but

sliderbox.slider( "option", "values", [ 0, 50,75,100 ] );

not works as expected. it just sets new values 0, 50,75 for existed handlers.

Answer 1

It seems there is no way to change the length of values array using slider widget methods. Another option to change it also fails. For example:

$("#slide_me").slider({
    animate: true,
    value: 0,
    values: [0, 50, 60, 70, 80],
    min: 0,
    max: 100,
    slide: function(event, ui) {
        $("#my_value").val(ui.value);
    }
});

$("#slide_me").slider("values", [10, 20, 30, 40, 50, 60, 70]);

sets only the first 5 handlers.

It seems that you have to redefine your slider completely.

You can try to do that manually. The last handler which has value 50 is added as

<a class="ui-slider-handle ui-state-default ui-corner-all" href="#" style="left: 50%;"></a>

So handlers for values 60 and 70 could be added if you build them in similar way.