Getting attribute errors with automated attributes checker

I’ve been struggling trying to figure out why my filtering isn’t working, especially when the Finsweet self-service checker is reporting errors, saying I added the attributes to the wrong element, when in designer, I have added it to the correct one.

Has anyone else experienced this, and is there something I’m doing wrong with the filters?

Thank you!

Read only
Live page

Self service checker

In designer, showing the correct attribute on the correct checkbox label

Published page showing the attribute in the code

UPDATE 7/19/23
I’m still getting errors through the attributes checker on the radio buttons. To test, I have added an input field and the field identifier attribute to it, and this is working correctly. So I really don’t know why this isn’t working with radios or checkboxes

Hello @Drcontempo , it doesn’t work because you have a hidden select field with the attribute fs-cmsfilter-field="tags". It causes a conflict with the radio buttons having the same attribute. Consider removing the select field or the attribute fs-cmsfilter-field with value tag

Ok I see thanks for explaining that!..In my use case, on mobile, I’m using a different UI (dropdown) vs radios on desktop, but will be filtering the same list. Is there a way this can be possible? Where 2 different UI components filter the same list?

Or will I just have to use CSS to make the one radio component look like a different UI?

You could use a different attribute value on the select e.g. fs-cmsfilter-field="mobile-tags" and on the cms items have 2 same elements one with fs-cmsfilter-field="tags" for web and fs-cmsfilter-field="mobile-tags" for mobile

1 Like

Ok that is precisely what I thought. Thanks so much!