Error with finsweet attributes in cms filter system

well I’m coming to you because I’m having a few problems and I’m going round in circles…

I have a cms catalog that is filtered and sorted with finsweet attributes on a page of my site.
I have an error on the height and width slider selections, it doesn’t take into account comma numbers, or at least that makes it buggy… I don’t know how to tell it to take the comma into account? Maybe it doesn’t, in which case I’d have to review the height and width selection system… What do you think? Any ideas on how to get around the problem?

The other error is that when I use the “(” or “)” character in the input fields, the whole list becomes empty and it becomes difficult to delete and reset the filter system… One solution would be to define characters that can’t be typed in input fields. Any ideas on how to do this?

I don’t know if I’ve made myself perfectly clear, so of course I’m at your disposal to shed more light on the problem…

BIG THANK’S

Here’s my read link only:
https://preview.webflow.com/preview/cccod-catalogue-olivier-debre?utm_medium=preview_link&utm_source=designer&utm_content=cccod-catalogue-olivier-debre&preview=1db1ea73eab34b74c0b1853abc2e42d7&pageId=649e35974d057991523691dd&workflow=preview

Here’s my live site for testing filters:

Hi Lacroix,

I use FS CMS filter a lot, and both of these are edge cases that I have not encountered.
I’d strongly recommend you sign up for Finsweet plus and use their forum, the team there knows their product well.

For your numeric filter, parsing formatted numbers ( e.g. 46,700.00 ) and Internationally localized numbers ( e.g. 46,5 ) is something JavaScript is not great at. Your best approach is to store and work with your numbers in as unformatted values e.g. 46.5, use those for filtering, and then handle your displayed number separately so it can be locally formatted.

A good example is currency formatting. If I want to show a house price as $1,200,000, but I want FS Filter to be able to range filter it, I put two fields in the page. One is unformatted as 1200000 and it has the FS filter attributes applied. The other is for display purposes only and I format it using JS.

I’d probably approach your situation as as;

  • Change the CMS so that you’re storing the Dimensions hauteur (en cm) and Dimensions largeur (en cm) in numeric fields ( one decimal place ) rather than text fields.
  • Embed two versions of each field in your product gallery- one, hidden, is used for filtering. The other, displayed, gets formatted in French using the comma as the decimal separator.
  • The displayed number e.g. 46,5 might be supported using Webflow’s numeric formatting options since your site is already configured for the French locale. ** The new localization features arriving soon may change everything as well. If that’s not an option, you can do this formatting easily using JS’s Intl.NumberFormat.

I think FS will recommend the same approach.

Your second issue is particularly strange and difficult to reproduce consistently. I did get it to happen once and it was interesting how it broke, rather than displaying a “no matches found” message.

If you can make this reproduceable, I’d submit this to finsweet, it may be a bug or it could be a different script in your site interfering.

One approach might be to prevent the entry of parens into the text filter fields using JS.