CODEWITHSUNDEEP
jqueryajaxslider
Ryan Smith
Ryan Smith

Reputation: 8324

JQuery Slider - Call function after slide

I have a JQuery silder that I'm using to set the score on a web application. I orignally had it so that the user clicked a submit button, but the client now wants it to update AJAX style.

This would work find, but the slide function gets call on every movement, so my AJAX script will send a score before the slider has finished being moved.

Is there a function on the JQuery slider that gets called on release of the slider? Is there a straight forward way for me to check to see when the slider has been released?

Thanks,.

Upvotes: 11

Views: 22702

Answers (3)

FryGuy
FryGuy

Reputation: 8744

After a quick perusal of the source code, I would say to try using 'stop' or 'change' instead of 'slide.' It seems that the 'stop' event happens on mouseup, and the 'change' event happens on mouseup but only if the value changed. I didn't see any documentation on this, of course, I didn't look very hard.

Upvotes: 20

Salty
Salty

Reputation: 6688

When initializing the slider, use this:

var slider = $('.slider').slider({ 
    steps: 10,
    handle: $('.knob'),
    animate:'true',
    min:1,
    max:10,
    startValue: 1,
    change: function(e,ui){
        //Do something with ui.value
    } 
});

Upvotes: 10

Stobor
Stobor

Reputation: 45132

The documentation confirms what FryGuy just said... From the slider options page:

change Function(Event, ui): Function that gets called on slide stop, but only if the slider position has changed.

stop Function(Event, ui): Function that gets called when the user stops sliding.

Upvotes: 6

Related Questions