Basic Function of Filter Components

Version

Application Scenario

This section introduces the functions related to filter components.

Function Description

The following table describes basic functions of filter components.

If you want to display only partial options (A, B, and C) from the originally-listed options (A, B, C, and D) of a filter component, you can filter the listed options.

For example, if you only want to display three types of contracts in the dashboard text drop-down list, you can add the required field to the filter component and select Filter from the drop-down list, as shown in the following figure.

Add filter conditions by selecting In, Purchase contract, Long-term agreement, and Long-term agreement order in sequence in the Contract Type area and clicking OK.

In this case, only three contract types are available in this filter component, as shown in the following figure.

Note:

The time and value filter components do not support the above filter function.

After listed options are sorted, you can locate required options more quickly. For example, a sorting order like "A, B, C, D" is more user-friendly than a random order like "A, D, C, B".

Ascending/Descending Order

You can sort the listed contract types by contract amount in the ascending order.

1. On the filter component setting page, you can add sorting settings for the filter field, as shown in the following figure.

2. You can select a field on which the sorting (configured for the filter field) depends. For example, you can set Contract Type to be sorted in the ascending order by Total Amount and click OK to save the setting, as shown in the following figure.

3. You can check the data in the text filter component to ensure that the values of the Contract Type field are sorted by Total Amount, as shown in the following figure.

If you want to sort data in the descending order, follow the same steps as above.

Custom Sort

Custom Sort allows you to manually re-sort filter options by dragging data.

On the filter component editing page, only specified components are subject to the filter effect after you customize the control range. If you do not customize the control range, the default control range will be used.

If you select Component and Component2 in Control Range on the right, this filter component controls only these two components (which are subject to the filter effect) in the dashboard, as shown in the following figure.

In Control Range on the right, uncontrollable components are grayed out, with the message "No field is bound or this component cannot be controlled by bound fields.” displayed. This message indicates that the grayed-out component is uncontrollable because it has no data relationship with the field bound to the filter component.

You can switch between the display types for filter components of the same type (for example, text filter components, value filter components, and time filter components) on the setting page.

For example, you can click the drop-down icon next to Display Type and switch the display type of the current text filter component.

You can select Button Group to change the display type of the filter component from Text Drop-Down to Button Group.

The default value can provide you with a preset option, allowing the most-used option to be set as the default value for higher viewing efficiency.

For example, the latest time can be selected as the default value in the time component to help you quickly access the latest records or data. In the current text component, Purchase contract can be selected as the default value because the purchase contract is the most frequently-viewed or highly-relevant contract type.

Note:

If Custom Value List is selected, the Default Value option is not available.

1. If you select the Current Value option in the filter component, the selected items in the red area will be automatically set as the default values. For example, Long-term agreement order and Purchase contract are set as the default values in this case, as shown in the following figure.

2. If you do not select Current Value, different default value options are provided for the filter component based on the display type. The following table describes specific options.

On the filter component editing page, you can set Filter Method to Single or Multiple so that one or more options can be selected in the drop-down list.

For example, if you set Filter Method to Single in the value drop-down filter component, you can select only one option for filtering in the drop-down list, as shown in the following figure.

If you set Filter Method to Multiple in the text drop-down filter component, you can select multiple options for filtering in the drop-down list, as shown in the following figure.

In some cases, you need to set required options as mandatory in the filter component.

For example, the volume of data used to create a dashboard may be extremely large. If you clear the filter component to display all data, the query result volume may be very large, which even causes system downtime. To avoid this situation, you can set some filter options as mandatory in the filter component to ensure that only partial data is always displayed.

1. Tick Set as Mandatory for Contract Type and then select an initial value.

2. If you clear this component, the message "The mandatory option cannot be empty." will be displayed, as shown in the following figure.

If you click Clear Selected Data for the text filter component with selected filter conditions, all selected conditions will be cleared. Then you can re-select options again, as shown in the following figure.

You can set the style of all filter components in the dashboard, including Title Background, Title Font, Component Background, and Theme Color.

Choose Dashboard Style > Custom > Filter Component, set the title background as pink, make the title font bold, set the component background as watermelon red, set the rounded corner of the component to 2, and set the border size to 2. In addition, set the theme color of the filter component box as gray. The following figure shows the effect.

If you need to set the style of other components in the dashboard, see Dashboard Style.

Cross-Table Field Optional for Filtering

If the component is made using multiple associated tables, you can select fields from the associated tables for filtering.

Calculation Field Optional for Filtering

In 6.0.8 and later versions, you can select calculation fields for filtering in the filter component.