View Article

Add a Filter Data Table Button

By Xelence Documentation posted 04-03-2023 15:20

  

Introduction

A Filter Data Table button allows the user to execute a query on the application server to populate the collection and bind it to the form.

This is another way to help the user find the value they want in a data table collection, especially a large one. Unlike the data table filtering method, which is client side, this is server side. Any request the user submits will incur processing time.

Prerequisites

The query you want to use on the Data Table must already exist in the entity.

Quick Steps
1 Add a new collapsible control
2 Add a Search button and enter the button details
3 Add the criteria fields
4 Edit the filter collapsible control layout
5 Select the data table and bind it to the filter query
6 Save the form

Detailed Steps

Step 1. Add a new collapsible control.

You will add a new collapsible control above the existing collapsible control. It's the Order Details collapsible control in this case.


You will add a button and criteria fields to this new collapsible control.

Drag and drop the collapsible control from the toolbox above the data table you want to filter. Update the caption and number of rows and columns in each row for the collapsible control.

The collapsible control is added above the Order Details data table.



Step 2. Add a Search button and enter the details.

This button will filter the data table based on query results.

Drag and drop the Search button from the toolbar and enter the details:

  • Caption: Text the user sees. From their perspective, this is the button's name.
  • Related Control: The data table the button affects.



Step 3. Add the criteria fields.

Drag and drop the control or controls you want to use to filter the data table. This example adds a number control.

Bind each criteria field to the Query Field and update the caption to something that tells the user how to use the field. This example binds the number control with productid.



Step 4. Edit the filter collapsible control layout.

Organize the search criteria and the button so the layout is clean and makes sense to the user.



Step 5. Select the data table and bind it to the filter query.

Select the data table you want to filter with the controls you just added and bind it to the filter query with the following details:

  • Base Query: This the filter query the button executes.
  • Base Query Parameters: The Parameter Value is the column you're using as the parameter, which is set in the query. It's whatever the query checks for an @ value. Usually, a filter query uses its collection object's foreign key.

The base query for the Filter Data Table button comes from the collection’s entity in Xelence. It must exist in the entity before you can use it on the button. The query is going to take the parameter of the collection entity's foreign key.



Step 6. Save the form.


Then, run a preview. Xelence displays the form output. You can test your updated settings.

When you have previewed your form, it should look something like this:​


What are the improvements over S3 Version 6?

In the previous framework version, the configuration for the base query and base query parameter had to be done on the filter grid button and now, it is to be done in the data table properties.


This post is part of the Maintenance Form topic. Click here to open the Maintenance Form Overview.


#Xelence

#Forms

0 comments
139 views