All Collections
Use-case guides
Displaying data
Showing a list of tasks belonging to a user
Showing a list of tasks belonging to a user

Use case 3 of a 9 part use case series. In this article, you'll learn how to show a list of tasks.

Updated over a week ago

Before we start

Before we start, we will need some data. We’ve prepared the following tasks to show you how this works:

The list of tasks

There is a belongs to relation between the tasks data model and web user data model.

This means a task can be assigned to only one web user. The other way around, a web user can have multiple tasks assigned to him/her.

Use the data table from case 2

We have our data table from the previous case. It’s showing 3 columns, Title, email and Planned.

Let’s say we don’t want to show all tasks, but just the tasks which are assigned to jeroen@betty.nl

We go back to selecting our data table on the page so that we see its options.

Data table options

Now we will press the Create filter button and the modal for the filter appears:

Creating filter for a data table

As mentioned earlier, a filter consists of 3 parts. A property that is selected on the left-hand side. Followed by a comparator in the middle. Then on the right the value/variable/property you want to compare the left-hand side with.

So on the left, we select our web user property. When we press the Select a property button, we first see the model(s) which are in the context of this data table. In our case, there will only be one model, because we don’t have other data components on our page. But when you would drag a data table inside a data container, both based on a different model, there will be 2 models visible in this list.

However, we should now only see the Tasks data model.

Configuring a filter to a selected data model

Pressing on the arrow button shows the properties of the Tasks data model. We will select Webuser first, because in this case, it is a relation. Then after selecting Webuser, we should see the properties of our Webuser data model:

Select the web user relation (which refers to a data model):

Configuring filter property

And then select the property email:

Configuring filter property

The comparator can be equals like the default value it has. You can of course see what other values we have in this dropdown. More info about those can be found here.

Now on the right, we will type the email address jeroen@betty.nl Then press the Apply button. Your filter should look like this:

Configuring filter property

When you press save, the filter is stored. Now when pressing play, we should see an updated table. Only records with email jeroen@betty.nl should be in there:

Table with tasks

Next up, filtering data by a specific date.

Did this answer your question?