Flexible filtering

The Filter view pattern adds a flexible filter to a page which contains another view displaying multiple rows from a table. For example, a list or feed - or kanban board or maps from plug-ins.

To filter is to narrow down the set of rows shown, according to some criteria chosen by the user.

For example, for a clothes shop page, there is page showing all clothes for sale in a long list. You add a filter button labelled "Hats". When selected, the list shows only the hats. The filter is not a link to a different page, but a switch that restricts the view on the current page.

In Saltcorn, you filter using the view state. This is the part of the URL after the ?. You can set up different view pattern to change the view state.  For example, the visualize plug-in can modify the view state by clicking on wedges in pie charts. Drill down dashboards are implemented like this. 

The Filter view pattern only controls the view state. It does not show any rows from the table itself, so it is quite useless as a stand-alone view. You combine it with other views on pages, where it will control what is shown in the other views.

Configure a filter view

Choose which parts of the view state to control. Note that you can have more than one Filter on a page, as long as they are based on the same table. If you include two filters of different tables, or a filter of one table and the view of another table, you are likely to get errors.

A Filter-based view is built using the drag-and-drop builder. You can lay out the filter in a flexible manner based on columns and containers. The drag-and-drop builder has a few elements that are specific to Filter views:

  • Dropdown filter: given a field in the table, the user will see a select (drop down) menu with the different options for that field. When chosen, the view state will be restricted to rows where the field has the specified value. In the clothes shop example, the options are hats, gloves, scarves
  • Toggle filter: given a field in the table, and a chosen value for that field, the user will see a toggle (button) which either can be on or off. When the toggle is activated, the view is restricted to rows in which the field has the chosen value for that toggle filter. The example above with the hat filter was an example of a toggle filter where the chosen value was Hat.
  • Search bar: shows a search input box to the user. If they enter a value, the view will be restricted to items that match the entered term.