behnamizadi
behnamizadi

Reputation: 133

Return the index of chaged handle on jquery-ui slider

I have a jquery ui slider:

$( "#slider" ).slider({
    values: [ 10, 25,45,176 ],
    max: 190,
    change: function( event, ui ) {  
        var index = $("#slider span").index(ui.handle);
        $( "#index" ).text( "That was handle index #" + index );
    }
});

I want to return the index of the changed single handle. But the handle object returns all spans (handles).

How can i do that?

Upvotes: 1

Views: 1212

Answers (2)

Joe Bashe
Joe Bashe

Reputation: 150

For anyone seeing this after the March 2015 patch that added the handleIndex property to the ui object, if you need the index of the current handle, you can just use, for example:

$("#slider").slider({
    values: [10, 25, 45, 176],
    max: 190,
    change: function(event, ui) {  
        var index = ui.handleIndex;
        $("#index").text("That was handle index #" + index);
    }
});

Upvotes: 1

Josh Crozier
Josh Crozier

Reputation: 241178

Inside of the change event function, ui.handle is the element that was changed. Therefore, use $(ui.handle).index() to access the index of the element. Note: The index is zero-based.

Example Here

$("#slider").slider({
    values: [ 10, 25,45,176 ],
    max:190,
    change: function( event, ui ) {  
        var index = $(ui.handle).index();
        $("#index").text( "That was handle index #" + index );
    }
});

Upvotes: 2

Related Questions