-
Refer to
this
page to learn about the Search element in pages
- When you use different field types while setting the criteria to filter the report, you'll still be able to add the filter. The search results will not display any data in such cases. We're working towards handling the different fields filter criteria at the setting stage itself.
- Edit your app.
- Open the builder of the required page.
-
Click Search on the left, then drag and drop the required template to your page.
-
Configure the search element in the Search Configuration pane so as to:
To show the search results in a report
-
Select Report in the Properties tab on the right, then select the required report:
-
Set the required criteria to filter the report, then click Done . Fields displayed by the report can only be filtered using the search input, which is denoted by input.searchString :
- Select the required value from the Open in dropdown. This defines the window in which the selected report will be displayed when user clicks or taps the button in the search element.
- Set the Default value (optional). This is the value that will appear in the search bar by default.
-
Set the Placeholder text. It's "Enter value" by default. This is the value that will appear in the search bar until the user enters an input in it.
To show the search results on a page
- Before proceeding to the below steps, you need to embed a report either on the same page or the different page where you want to display the results. This report will serve to display the search results, filtering out records that align with the specified search criteria.
- As part of this process, add a page parameter in the target page with the field link name of the field in which the search is to be applied in the embedded report. For example, let us consider order management application with a list of product details such as Product Name, Image, and Specification in a report, and it is embedded in a page for configuring search bar. In the scenario where you aim to conduct searches based on the Product Name field, it is essential to add a page parameter. This parameter should bear the field link name of the said Product Name field, which in this case would be product_name.
- Click on the Target Page dropdown in the Properties tab on the right and select the page with the embedded report to show the search results. It can either be the same page or a different page in your application:
- Select the field link name given in the parameter of the page. Map the search input, denoted by input.searchString, with a parameter in the selected page
- Select the required value from the Open in dropdown. This defines the window in which the selected page will be displayed when the user clicks or taps the button in the search element.
- Set the Default value (optional). This is the value that will appear in the search bar by default.
-
Set the Placeholder text. It's "Enter value" by default. This is the value that will appear in the search bar until the user enters an input in it.
Now, navigate to the target page's builder and configure the filter for the report embedded in the page. This involves aligning the specified field's value with the value of the search parameter, effectively filtering the results to match the designated criteria. To do so,
Click on Add Filter and configure the criteria to match the desired field and the designated parameter.
Choose the specific field where you want to apply the search. In other words, select the field which corresponds to the field link name specified in the parameter.
Select the preferred operator from the available options. Here we have selected contains.
Enter the value as input.<parameter>.
Click Done to finalize the setup. When a user initiates a search, they will automatically be directed to the designated page. On this page, the embedded report will showcase the search results, as the report is dynamically filtered to display data matching the search criteria.
