Why does onChange not update the slider itself?

[gfmoore]

Here is my code

  $('#zslider').ionRangeSlider({
    skin: 'big',
    type: 'double',
    min: -5.000,
    max: 5.000,
    from: -5.000,
    to: 5.000,
    step: 0.001,
    grid: true,
    grid_num: 10,
    //on slider handles change
    onChange: function (data) {
      console.log( data.from );
      $zslider.update( {
        to:   -data.from
      })
    },
    onFinish: function (data) {
      // $zslider.update( {
      //   to:   -data.from
      // })
    }
  })

  const $zslider = $("#zslider").data("ionRangeSlider");

  const $zslider = $("#zslider").data("ionRangeSlider");

html

So I want moving the left slider to update the right slider. i.e if left slider is -1 right slider is +3, but continually. It works if I wait till the end of the move.

Is there some kind of timer in the code?

Result is I move left slider a small amount and it moves right slider a small amount and then STOPS.

[gfmoore]

Oh, I see the problem; onChange, I update the slider by slider.update which calls onChange ad infinitum. Uhmm, how to break that deadlock. Need a flag that I can reset.

[gfmoore]

Actually I don't think calling the update causes the onChange to trigger, it causes onUpdate to trigger.

[gfmoore]

The problem seems to be due to the observation that calling onUpdate causes the slider to lose focus.

I'm also noticing some weird Chrome warnings (on Edge) that point to multiple violations being generated on startup that it has to stop.

[IonDen]

Hi, yes. You could update another slider demo1, demo2 But updating itself will not work. Slider will rebuild itself onUpdate - that is why you will loose focus.