search

leongersen / noUiSlider

noUiSlider is a lightweight, ARIA-accessible JavaScript range slider with multi-touch and keyboard support. It is fully GPU animated: no reflows, so it is fast; even on older devices. It also fits wonderfully in responsive designs and has no dependencies.
https://refreshless.com/nouislider/
MIT License
5.64k stars 658 forks source link

noUiSlider and Input type="number" #1191

Closed RomeoBy closed 2 years ago

RomeoBy commented 2 years ago

Hey! Cool slider! I don't understand why it doesn't work for me? I set the slider to input type="number" (https://refreshless.com/nouislider/examples/#section-html5) but nothing happens when moving. If you manually change the values ​​- then everything works.

Here is an example: Link

What am I doing wrong?

leongersen commented 2 years ago

You're talking about the "frequency" label not updating when moving the slider?

image

I don't work with Vue myself, but I'm assuming you'll need to update carrier.freq instead of freqInput.value in your update event handler to keep your model in sync.

RomeoBy commented 2 years ago

No, the label frequency it doesn't matter. I want the frequency value in the input to change when the slider moves. The value itself changes, but the frequency does not change. If you manually enter numbers in the input, then the frequency changes normally and the slider moves. I don't know how to do it, noUiSlider seems to change the value in the input, but the frequency doesn't change...

leongersen commented 2 years ago

Your example broke (which is why is prefer code posted in issues over external links!), but i'll refer you to my previous comment: this is something you need to solve in your Vue model.

github-actions[bot] commented 2 years ago

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.