Updating range slider

Attributes
1

How do you update the values of a range slider via script, and trigger it to update?

I’m updating the associated INPUT field however the range slider is not updating.

Also I need that update to trigger an FS Filter refresh.

2

Hey @memetican! I believe you should be able to directly modify the input value and dispatch a new event to trigger the filtering.

3

When I modify the input value and dispatch an event the filtering updates perfectly, however the range slider does not update, so the results being shown do not match the filter being shown.

4

Can you share a link?

5

Hey! I was looking to do the same, I manage to do it by sending 2 dispatchEvent. The first one updates the range fill and the second one updates the range handle value.

I don’t know if there is a cleaner way to do it, but by dispatching a change and an input it works

yourInput.dispatchEvent(new Event('change', { bubbles: true }));
yourInput.dispatchEvent(new Event('input', { bubbles: true }));
2 Likes
6

This worked beautifully for me. Thanks @terence!

1 Like