FilterPanel
Displays an input window for filtering using the value entered by the user under the GridHeader area.
Signature:
export interface FilterPanel
Remarks
After selecting the condition according to DataColumn.valueType and entering the value in the input window, The filter is applied after the time specified in FilterPanel.filterDelay .
Properties
Property | Type | Description |
---|---|---|
beforeCommit | boolean | Whether to commit when focus is placed on the filter input window while editing data |
crossWhenKeyBoard | boolean | Whether to move data and filterPanel using the keyboard's up key and down key |
dateOperators | { [key: string]: string; } | Enter the filterOperator to be used by the column where ValueType is date . |
filterDelay | number | The filter is applied after the user input ends and a specified time has passed. |
filterPanelCallback | FilterPanelCallback | A callback called when you enter text in the input window of filterPanel and then enter enter |
height | number | Specifies the height of filterPanel. If the data row consists of multiple lines, the filterPanel is also displayed in the same form, and the height of the filterPanel is applied as the number of lines in the data row * minRowHeight or height, whichever is larger. |
ignoreCase | boolean | Case sensitive |
minRowHeight | number | Specifies the minimum height of the row. |
numberOperators | { [key: string]: string; } | Enter the filterOperator to be used by the column where ValueType is number . |
showInput | boolean | Whether to show the input window in filterPanel |
styleName | string | style class name |
textOperators | { [key: string]: string; } | Enter the filterOperator to be used by the column where ValueType is text . |
trimData | boolean | Clear spaces before and after the value and data entered in the input window and apply the filter. |
visible | boolean | Whether filterPanel is visible |
Methods
Method | Type | Description |
---|---|---|
clearInput(column) | clearInput?(column?: string): void; | Delete the text entered in the filterPanel and deactivate the filter. |
Properties Desc
beforeCommit
Whether to commit when focus is placed on the filter input window while editing data.
Type
- boolean
Remarks:
If false
, focus can be given to the filter input window only after editing is completed.
crossWhenKeyBoard
Whether to move data and filterPanel using the keyboard's up
key and down
key.
Type
- boolean
Remarks:
If true
, use the down
key on the keyboard to move from the filterPanel to the data area, or use the up
key on the first row of data to move to the filterPanel. You can move.
dateOperators
Enter the filterOperator to be used by the column where ValueType is date
.
Type
- { [key: string]: string; }
filterDelay
The filter is applied after the user input ends and a specified time has passed.
Type
- number
filterPanelCallback
A callback called when enter
is entered after entering text in the input window of filterPanel.
Type
- FilterPanelCallback
Remarks:
When the callback is set, the filtering of the grid filterPanel is not applied.
height
Specifies the height of filterPanel. If the data row consists of multiple lines, the filterPanel is also displayed in the same form, and the height of the filterPanel is applied as the number of lines in the data row * minRowHeight or height, whichever is larger.
Type
- number
ignoreCase
Case sensitive?
Type
- boolean
minRowHeight
Specifies the minimum height of the row.
Type
- number
numberOperators
Enter the filterOperator to be used by the column where ValueType is number
.
Type
- { [key: string]: string; }
showInput
Whether to show the input window in filterPanel
Type
- boolean
Remarks:
If false
, the input window is displayed only for columns where DataColumn.showInlineFilter is true
.
styleName
style class name
Type
- string
textOperators
Enter the filterOperator to be used by the column where ValueType is text
.
Type
- { [key: string]: string; }
Remarks:
Specify the filterOperator to use or change the value displayed in the pop-up.
If you enter a value that is not in InlineFilterOperator, it will be ignored.
Example:
var textOperators = {
contains: "Data containing values",
notContains: "Data that does not contain values"
}
gridView.filterPanel.textOperators = textOperators;
trimData
Clear spaces before and after the value and data entered in the input window and apply the filter.
Type
- boolean
visible
Whether filterPanel is visible
Type
- boolean
Method Desc
clearInput
Delete the text entered in the filterPanel and deactivate the filter.
[Parameter List]
column
- string
string
[Return Value] - void
Remarks:
If column
is specified, only the text of the specified column is deleted.