Discuss

Filtering Database Query with Multiple Checkboxes

On this page

You can use multiple checkboxes in order to filter your database queries.

In our example we already created a server action with database query which shows the products in a dynamic table. It shows all the products currently, but we want to be able to filter them by category:

Screenshot_16|690x393

First let's add a form. Click the insert (in our case insert before) button, in order to place the checkboxes above the table on the page:

Screenshot_17|690x393

Open Forms category and add a From:

Screenshot_18|690x393

Then, click Insert Inside button, and select Multi Checkbox Form Group:

Screenshot_19|690x393

The multi checkbox group adds a few dummy checkboxes. We can easily edit them, remove them or add more if required. Select the first checkbox(1) in the app structure and add the value you need for it (2). This value will be used to filter the records:

Screenshot_20|690x393

Do the same for its label - select the label and edit its text:

Screenshot_21|690x393

Then, do the same thing for all of your checkboxes, adding appropriate values to them.

Now, open the server connect panel:

Screenshot_22|690x393

Open your server action, select $_GET and add click the Add New button:

Screenshot_23|690x393

Add an array:

Screenshot_24|690x393

And add a name for the array. We call it category:

Screenshot_26|690x393

Click your database query, and open the query builder to edit its options:

Screenshot_27|690x393

Under the Conditions tab, select the column you want to filter your query by:

Screenshot_28|690x393

Select the IN operator:

Screenshot_29|690x393

And click the dynamic data picker:

Screenshot_30|690x393

Select the array which we created under $_GET, then click the Data Formatter icon:

Screenshot_31|690x393

Right click the $_GET.category array and open the Text category:

Screenshot_32|690x393

Select the Split string option:

Screenshot_33|690x393

Then, click character and enter , (comma):

Screenshot_34|690x393

Click select:

Screenshot_35|690x393

We want to show all the results on page load, and only filter them if a checkbox is selected, so we need to add a condition which checks that. Click the dynamic data picker for the condition:

Screenshot_36|690x393

And select the category array as a condition expression:

Screenshot_37|690x393

This way the filter will be applied, only if the $_GET.category has a value i.e. when a checkbox is selected. Click OK:

Screenshot_38|690x393

Save your server action, close the server connect panel and go back to your page:

Screenshot_39|690x393

Select the server connect component in app structure and you will see the $_GET variable we added in server connect. Click the dynamic data picker, to assign a value to it:

Screenshot_40|690x393

Its value must be the value of the Checkbox Group:

Screenshot_41|690x393

And you are done, now the records will be filtered when you select any of the checkboxes:

Screenshot_42|690x393


WapplerPrevious|101x31   WapplerNext|77x31