CMS filter attribute not working properly

I am building a blog page for a client where blog posts have several associated categories. I created to CMS lists - one for the posts and one for the categories. I am using CMS nest (which is working properly) and CMS filter which is not working correctly.

I am using the checkbox in the form as the filter buttons but only the first option seems to trigger any interaction with the CMS list below.

Here is the read only page

I also would like to know how to style the checkboxes so they look more like buttons that when clicked change color of the box and text to an active state to reflect which filters are turned on.

Also I should add that I’ve used the automated support service and I received an error. See Screenshot below. However I cant find a duplicate anywhere…

Screen Shot 2024-01-18 at 10.45.43 AM

Hey @phil! The issue comes from your form placement. Currently, you have a form inside the collection item once the site is published this creates the same amount of forms as the amount of filters, that is the reason behind the Support tool error.

To fix, can you please make the filter collection a child of the form? Something like the screenshot below

Also, as a sidenote, I noticed you have the “Start checked” option set for your checkbox, this will check all filters inside the collection list and introduce unwanted behavior. To show all posts you can create a non-cms checkbox with the clear attribute that starts checked to show all posts on page load.

Let me know if you need any help! :muscle:

Hey Luis,

Thanks so much for your help. I’ve done exactly that and now all of the checkboxes are triggering responses from the blog posts. However I’m not getting any results back. They keep showing up empty.

Can you take another look and see if I missed something else?

read only link

I only have the “start checked” option enabled on a hidden element as I was styling checked and unchecked and wanted to be able to easily see it. It’s not tied to the cms. I’ll look at adding the clear attribute though that’s a good feature to have.

Hey @phil! Sure, the issue now comes from the CMS Nest setup, I’m sorry I missed this earlier.

You seem to be missing half the setup, you only have the parent list and the list to be nested setup, there should be a blank div block with the attributes fs-cmsnest-element=nest-target and fs-cmsnest-collection= categories. The setup on the template page seems good :muscle:

Also, you can remove the CMS Filter identifier from the item element. Once the tags are nested these will work to filter the list as expected.

Yes of course! Thank you SO much. The reason you missed it was because I had there before and deleted the div accidentally. This has been so helpful!

1 Like

You are welcome! Let me know if you need anything else!

Hey Luis,

Hoping you can take another look at my read only link Everything was working great but suddenly the filters are coming up blank when you select any of them. I don’t think I changed anything that would trigger this error but hopefully you can identify the issue for me!