Moving the slider handles programmatically by step size

[jace]

I'm trying to get keyboard integration working with two text fields for the left and right slider handles, where pressing Up or Down in the text field increments or decrements the corresponding handle. Unfortunately, my slider has custom step ranges:

var slider = $("#slider").noUiSlider({
  start: [0, 10000000],
  step: 1,
  connect: true,
  behaviour: "tap",
  range: {
    'min': [0, 5000],
    '5%':  [100000, 10000],
    '80%': [1000000, 50000],
    '90%': [2000000, 100000],
    'max': [10000000, 1000000],
  },
  /* Serialization options */
});

This is a problem because if I try to do the following in my input field, incrementing by 1 or even 10 no longer works. I have to increment by 5000 until I reach 100,000, and then increment by 10,000:

$("#input-min").keydown(function(e) {
  // Convert the string to a number.
  var value = Number(slider.val()[0]);
  // 38 is key up,
  // 40 is key down.
  switch ( e.which ) {
    case 38:
      slider.val([value + 10, null]);
      e.preventDefault();
      break;
    case 40:
      slider.val([value - 10, null]);
      e.preventDefault();
      break;
  };
});

It'll be nice if I can instead use something like slider.val(['+1', null]), telling NoUiSlider to increment by one step, whatever the current step is.

[leongersen]

True. This is an issue I hadn't considered, I'll put some time in to adding this feature. Thanks for the clear description!

[leongersen]

This'll be in the next version.

[leongersen]

It took a while, but getCurrentStep is in noUiSlider 7. Have a look at the Changing the slider by keypress example for the implementation.

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.