Showing different filtered rows when checkboxes are selected

Hello,

I have of items that I want to filter by categories, with the use of checkboxes. Let’s say I have categories A, B, C and D, and I have 1 checkbox for each, which when selected should filter the repeater to show the respective category. Only, I want it to work like this:

  • all items on the checkboxes start unselected
  • when I click checkbox A, it filters the repeater below to only show A items.
  • when I then click on checkbox B, I want the repeater to show both A and B items, and so on for all categories.

As a summary, I need the repeater to show the items that are checked on the checkboxes, starting off from them all being unchecked and the full repeater being presented.

Can someone please help?

Many thanks,
Mónica

Hi!

What you are looking for is called “Facet Filters.” This post will get you started, but an alternative method (which I like better because the filters are simpler) is here. Either version has a lengthy explanation in the attached file.

Note that since I am no longer able to update the first post, be sure to download the latest sample file, located here.

Please let me know if you run into any snags.

1 Like

Hi @josephxbrick,

I can’t thank you enough, this is brilliant and exactly what I need. I’m still struggling with the checkboxes filtering correctly, but it was just the first attempt of adapting your filters to my existing design, so there might be something there messing it all up. I’ll figure it out. :slight_smile:

Cheers,
Mónica

Hi again @josephxbrick,

I’m now struggling to understand what the problem is. The only difference is that I can’t see the checkbox from the repeater’s function that adds local variables, so instead I created global variables and assign the checkbox value to the global variable and use that instead, and it seems to work. Only it only works for the first element. As soon as I add the second one, when I click on either checkboxes it doesn’t show anything on the list below. Any clues?

Many thanks,
Mónica

Hi Monica!

You can’t use a global variable here, because there is no way to set a global variable to the selected state of a widget, or to a widget at all for that matter. Only a local variable gives you that ability.

Make sure, when defining your local variables for the checkboxes in your filter, that “is selected of” is chosen in the dropdown between the name of the local variable and the checkbox widget specified at the right. Your local variable with then evaluate as true when the checkbox is checked or false when it’s not:

What you might want to do in order to debug this is to start off by creating only the first expression in the filter and making sure it works:

image

The expression above can be written more verbosely as follows, So you’d get rid of the exclamation points (which mean NOT) and instead enter the following, which does the exact same thing but reads a little easier:

[[ (G_isChecked == false && PG_isChecked == false && R_isChecked == false) ]]

If this works, all rows will appear when no checkbox is checked, and no rows will appear upon checking any checkbox, assuming you have the code in each checkbox that forces the repeater to re-evaluate its filter.

Again, let me know if this doesn’t help. You can also private message me with your file if you don’t want to share it broadly.

For anyone else following this thread, the problem turned out to be smart quotes. Axure doesn’t convert smart quotes to normal quotes in its filters, and Mac Catalina turns on smart quotes by default.

1 Like

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.