Zoho Creator Dynamic Filter in Page

Zoho Creator Dynamic Filter in Page

Why do you need a dynamic filter?

By default, the filters for each element in a Page are independent of each other. This poses a challenge as at times, users might need to filter the whole page according to their own preferences. One of the use cases is, user might want to filter the records by a date range. In this post, we will go through on how to do that using a stateless form.

Steps to create a dynamic date filter

STEP 1 : Create a stateless form and and name the new form.

STEP 2 : Add date fields to the form and name it Start Date and End Date respectively.

STEP 3 : Create a new workflow in the stateless form. The action should be triggered on clicking the 'Submit' button. Create a function and write the below script:

  1. openUrl(zoho.appuri + "#Page:{your page name}?startDate=" + input.startDate + "&endDate=" + input.End_Date,"same window");

STEP 4 : Select the respective stateless form you created from the 'Form' dropdown and click and drag the Embed as Form option to embed a form into the page builder.

Zoho Creator Dynamic Filter - Add Form


STEP 5 : Add two new variables named "startDate" and "endDate" with data type string in the Page Variables tab.

Zoho Creator Dynamic Filter - Add Page Variables

STEP 6 : In the Page Script (can be seen when you are adding new variables) , enter the required script in the Deluge code editor.


The code sets a default date range spanning the entire current year if no specific dates are given.

  1. if(input.startDate == null)
  2. {
  3. input.startDate = "01-01-" + today.getYear().toString();
  4. }
  5. if(input.endDate == null)
  6. {
  7. input.endDate = "31-12-" + today.getYear().toString();
  8. }
Note: refer getYear() funtion and toString() function in Zoho Deluge articles for more information.

STEP 7 : Click on the form added in the page, and then click Configure option in the toolbar and under the Field values tab, a field will appear chosen by default and then specify its value to be the respective Page Variables values.

Zoho Creator Dynamic Filter - Set value in form

STEP 8 : Choose one of the panels to be tested and create the criteria by selecting the criteria field, operator, and value. Set the condition as AND to display records that match both the conditions.

Zoho Creator Dynamic Filter - set filters


And then you can test it out!

Do remember that this is just a demonstration of filtering based on a date range, but it is not limited to only that. You could filter the elements based on any information, really. Some that we could think off is by ownership, departments, territory, types, categories, and many more.

We hope that this article is useful for you as our experience of searching on how to do this was not that good. There weren't many helpful articles out there, and most of what we found were heavily outdated.

If you find it useful, please consider giving us a thumbs up and share this with others!

Good luck!