Prevent change event when sliding

[gurpal2000Member]

Hi how do you prevent the change event from firing when physically sliding until slideEnd is reached?

thanks

[gurpal2000Member]

I ended up with a workaround using the jquery setTimeout() function like so:

var sliderTimer;
$('#divSlider').jqxSlider({
...
}).bind('change', function(event) {
clearTimeout(sliderTimer);
sliderTimer = setTimeout(function() {
// do what actions you need
}, 300); // timeout time (ms)
});

[Peter StoevKeymaster]

Hi gurpal2000,

There’s a slideEnd event in the jqxSlider, too.

Best Regards.
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[gurpal2000Member]

The slideEnd event didn’t help though. Because the buttons don’t fire… Let me provide an example of exactly what im trying to do. standby300

• This reply was modified 11 years ago by  gurpal2000.

[gurpal2000Member]

OK this is my first jsfiddle ever 🙂

http://jsfiddle.net/gurpal2000/SFjdV/15/

1. the data model is shared timeseries between the slider and the dropdown
2. the model can be navigated by dropdown, slider (click, and slide) and via slider buittons. i want to give the user the choice on mutliple ways to navigate.

problems/issues:

1. without my timeout code, each time i slide the thumb, the change event was called each time. With slideEnd, i found that the buttons don’t fire. I can go to event A to event C real fast without firing B.
2. when the slide value is changed, the dropdown should reflect that change also. and of course the result.
3. when i chose new dropdown value, the slider should change to the right index. Problem is infinite loop firing.

So slider and combo need to be in sync, without firing actions DOUBLY.

thanks,

• This reply was modified 11 years ago by  gurpal2000.
• This reply was modified 11 years ago by  gurpal2000.
• This reply was modified 11 years ago by  gurpal2000.
• This reply was modified 11 years ago by  gurpal2000.

[Peter StoevKeymaster]

Hi gurpal2000,

The slide, slideEnd and slideStart events are raised only when the thumb is dragged. Clicking the buttons will raise the ‘change’ event.
The DropDownList’s select event returns information about the ‘select’ type i.e whether it is from keyboard, mouse or through an API call. In the event handler, you can use the event.args.type property. This will allow you to sync your widgets without infinite loop.

Best Regards.
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts