CODEWITHSUNDEEP
jqueryjquery-uislideruislider
emc
emc

Reputation: 507

Fix lagging jQuery UI Slider update values

http://jsfiddle.net/emcniece/7Zj7M/2/

I can't figure out why the slider slide: function() only seems to update to the previous position. The sliders and labels start at the correct locations (1 and 3), but they don't update the labels on the first move... then for every move after that, they return the previous location value. For example:

  1. Move min slide handle (value 1) to the right - labels don't update
  2. Move min slide handle (now should be value 2) to the left - label updates to "2", even though handle position should be "1"
  3. Move min slide handle left, then right once more. Slide handle is now in the "1" position, but the label value is 0

I tried to follow the example at http://jqueryui.com/slider/#range - What am I doing wrong?

Upvotes: 0

Views: 334

Answers (1)

Dan O
Dan O

Reputation: 6090

the handles' values haven't been changed yet when the 'slide' event occurs. You're always logging the current values for each handle, not the "just-moved-the-slider-to" values.

According to the docs, ui.value contains the value which the handle will have if you do not cancel the slide event. And ui.values is an array containing the values for both handles (with the same caveat). So, try this:

slide: function(e, u){
    $(this).parent().children('.label-min').text(u.values[0]);
    $(this).parent().children('.label-max').text(u.values[1]);
},

Upvotes: 1

Related Questions