How to get jQuery ui range slider selected values

Question

I am using jQuery ui range slider http://jqueryui.com/demos/slider/#range in which there are two values that are being get when sliding is done (selection of range is done) then how to get those values into jQuery variables and only after the range is being selected ? i have to make a ajax call after that i get those values . can anyone help me this that how to get those values only after the both range selection is completed ?

I'm using this jQuery ui function to initiate the slider

$(function() {
    $( "#slider-range" ).slider({
        range: true,
        min: 0,
        max: 500,
        values: [ 75, 300 ],
        slide: function( event, ui ) {
            $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
        }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
        " - $" + $( "#slider-range" ).slider( "values", 1 ) );
});

Mihai Matei · Accepted Answer · 2012-08-02 11:50:03Z

16

$(function() { 
    $( "#slider-range" ).slider({ 
        range: true, 
        min: 0, 
        max: 500, 
        values: [ 75, 300 ], 
        slide: function( event, ui ) { 
            $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] ); 
        },
        change: function(event, ui) {
            // when the user change the slider
        },
        stop: function(event, ui) {
            // when the user stopped changing the slider
            $.POST("to.php",{first_value:ui.values[0], second_value:ui.values[1]},function(data){},'json');
        }
    }); 
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) + 
                        " - $" + $( "#slider-range" ).slider( "values", 1 ) ); 
});

edited Aug 2, 2012 at 11:50

answered Aug 2, 2012 at 11:35

Mihai Matei

24.3k5 gold badges34 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Sakshi Sharma Over a year ago

how to get both values seperate and i dnt wana use json i ll use $ajax any solution for tht

Mihai Matei Over a year ago

you can get them like you did in the slide function, so first value will be ui.values[0] and the second one will be ui.values[1]; I've just gave you an example about using ajax request, you can use your own script :)

Sakshi Sharma Over a year ago

thanks for the help friend .. got it . its running as i wanted :)

Mihai Matei Over a year ago

Welcome, glad to hear this :)

Collectives™ on Stack Overflow

How to get jQuery ui range slider selected values

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related