Creating Custom Data Filters in Mendix
Using non-persistent entities and microflows only.
The Mendix Marketplace contains a number of widgets that can be used to filter your list view or datagrid. Sometimes, though, the solutions available don’t satisfy your app's requirements and you need to create your own custom solutions. Today we are going to learn about a new way through which we can easily filter out data on our own accord using non-persistent entities and some microflows.
Why Non-Persistent Entities?
Using a non-persistent entity (or NPE for short), we can make use of as many search fields as we want without having to worry about any data being stored in the database. An NPE comes in very handy in these situations. Also, you don’t need to worry about any security issues because whatever you save in this entity will be available only for the session.
How can we achieve this?
Assume in our case that we have a very long list of courses in our system and we want want to filter it on the basis of name.
Step 1
Go to your domain model and create an NPE, give it a suitable name (e.g. Filter), and add an attribute on the base of which you want to filter the list, in our case Name(String).
Note: Configure entity access if applicable
Step 2
Now, on the page, where your data is shown using a list view, place a data view and set its source to ‘microflow’ (remember to name the microflow something appropriate like ACT_GetFilter). This way, we can remove the context error and will be able to get the NPE object that we just created.
In our newly created microflow (ACT_GetFilter), add a create object activity, choose ‘$Filter’, and don’t forget to return the object from the microflow.
Step 3
From the connector tab (present just beside the toolbar tab), add a textbox for the name attribute into the data view.
With this done, the basic framework of our custom filter is prepared. We still have a few more things to add in order to achieve our goal, though.
Step 4
In the textbox you’ve just added, apply an on-change event on it.
Note: There are two behaviors by which the on-change event can be triggered, ‘When user leaves the input’ and ‘When User is entering data’
For our case, we will go with ‘When User is entering data’.
Double-click on your text box and switch to the event tab in the dialogue box.
Click on the on-change event and call a microflow, name it something like ACT_RefreshFilter, this microflow will refresh the filter object on-change of the characters inside the textbox.
Configuring our microflow,
In the microflow, ‘ACT_RefreshFilter’ add a change activity that refreshes the NPE.
Your microflow should look like this now :
Now, place your list view inside our newly configured data view, and set the ‘data source’ of the list view to microflow.
Name it ACT_GetCourseData. In the microflow, add a retrieve activity and select the course entity from the database and then apply an XPath constraint
[contains(Name,$Filter/Name)]Click OK, and don’t forget to set the newly retrieved list as the return value.
Your current page and microflow should look like this:
All Done!
With this, our filter functionality is completed! We can run our app and test out the functionality. When we get to the screen we can see our new filter, and it should start filtering the results as soon as we start typing in the text box.
I hope you find it interesting and useful in your upcoming projects!!
Read more
From the Publisher -
If you enjoyed this article you can find more like it on our Medium page. For great videos and live sessions, you can go to MxLive or our community Youtube page.
For the makers looking to get started, you can sign up for a free account, and get instant access to learning with our Academy.
Interested in getting more involved with our community? Join us in our Slack community channel.
