Hello everyone, I’m currently working on a Webflow project where I’m using Finsweet CMS filtering. The client wants a number field with plus and minus buttons, and when the value is increased or decreased, the CMS should update to show only the items that match the selected number.
You can check out the live site here:
The cleanest way to build this is probably to use standard input fields so that people can type in the number if they want to.
Then add adjacent buttons and JS to increment/decrement your field. To re-trigger FS Filter I recall that you’ll need to send an input event to an FS Filter-bound field, and allow it to bubble up so that the change is detected and the FS Filter update triggers.
but client wants to use the number field
That’s what I described above.
If you’re meaning plaintext with a number, rather than a numeric input field with a number, you could accomplish that as well but FS filter requires an input- so you’d have to write some custom code to sync your plain-text display-only field with the underlying FS filter trigger field.
Can you help me with the custom code?
It’s a fair bit to setup, if you need a dev I do projects like this and you can direct message me for rates.
Otherwise the increment and decrement you can solve using ChatGPT pretty easily. The FS Filter trigger may be harder- Finsweet has an excellent support forum as part of the Finsweet+ membership.
Thank you! I implemented your suggestion, and it successfully filtered the items. However, I’ve encountered an issue: when we reset the filters, the number value does not display. It only appears again if I manually enter a value.
Check out on live site:
If you’re wanting an initial value you’ll need to set that with code also.
Webflow doesn’t have a built-in way to set the default value of an input field.
