{/* Do not edit this file. It is automatically generated by API Documenter. */}


## FilterPanel

Displays an input window for filtering using the value entered by the user under the [GridHeader](/refs/Interface/GridHeader){/* */} area.

**Signature:**

```typescript
export interface FilterPanel
```

## Remarks

After selecting the condition according to [DataColumn.valueType](/refs/Interface/DataColumn#valuetype){/* */} and entering the value in the input window, The filter is applied after the time specified in [FilterPanel.filterDelay](/refs/Interface/FilterPanel#filterdelay){/* */} .

## Properties

| Property | Type | Description |
| --- | --- | --- |
| [beforeCommit](/refs/Interface/FilterPanel#beforecommit) | boolean | Whether to commit when focus is placed on the filter input window while editing data |
| [crossWhenKeyBoard](/refs/Interface/FilterPanel#crosswhenkeyboard) | boolean | Whether to move data and filterPanel using the keyboard's `up`{/* */}key and `down`{/* */}key |
| [dateOperators](/refs/Interface/FilterPanel#dateoperators) | \{ \[key: string\]: string; \} | Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#valuetype){/* */} is `date`{/* */}. |
| [filterDelay](/refs/Interface/FilterPanel#filterdelay) | number | The filter is applied after the user input ends and a specified time has passed. |
| [filterPanelCallback](/refs/Interface/FilterPanel#filterpanelcallback) | [FilterPanelCallback](/refs/realgrid#filterpanelcallback) | A callback called when you enter text in the input window of filterPanel and then enter `enter`{/* */} |
| [height](/refs/Interface/FilterPanel#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](/refs/Interface/FilterPanel#ignorecase) | boolean | Case sensitive |
| [minRowHeight](/refs/Interface/FilterPanel#minrowheight) | number | Specifies the minimum height of the row. |
| [numberOperators](/refs/Interface/FilterPanel#numberoperators) | \{ \[key: string\]: string; \} | Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#valuetype){/* */} is `number`{/* */}. |
| [showInput](/refs/Interface/FilterPanel#showinput) | boolean | Whether to show the input window in filterPanel |
| [styleName](/refs/Interface/FilterPanel#stylename) | string | style class name |
| [textOperators](/refs/Interface/FilterPanel#textoperators) | \{ \[key: string\]: string; \} | Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#valuetype){/* */} is `text`{/* */}. |
| [trimData](/refs/Interface/FilterPanel#trimdata) | boolean | Clear spaces before and after the value and data entered in the input window and apply the filter. |
| [visible](/refs/Interface/FilterPanel#visible) | boolean | Whether filterPanel is visible |

## Methods

| Method | Type | Description |
| --- | --- | --- |
| [clearInput(column)](/refs/Interface/FilterPanel#clearinput) | 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.

<hr/>

### 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.

<hr/>

### dateOperators

Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#valuetype){/* */} is `date`{/* */}.

`Type` - \{ \[key: string\]: string; \}

<hr/>

### filterDelay

The filter is applied after the user input ends and a specified time has passed.

`Type` - number

<hr/>

### filterPanelCallback

A callback called when `enter`{/* */} is entered after entering text in the input window of filterPanel.

`Type` - [FilterPanelCallback](/refs/realgrid#filterpanelcallback)

**Remarks:**

When the callback is set, the filtering of the grid filterPanel is not applied.

<hr/>

### 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

<hr/>

### ignoreCase

Case sensitive?

`Type` - boolean

<hr/>

### minRowHeight

Specifies the minimum height of the row.

`Type` - number

<hr/>

### numberOperators

Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#valuetype){/* */} is `number`{/* */}.

`Type` - \{ \[key: string\]: string; \}

<hr/>

### 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](/refs/Interface/DataColumn#showinlinefilter){/* */} is `true`{/* */}.

<hr/>

### styleName

style class name

`Type` - string

<hr/>

### textOperators

Enter the filterOperator to be used by the column where [ValueType](/refs/realgrid#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](/refs/realgrid#inlinefilteroperator){/* */}, it will be ignored.

**Example:**


```js
var textOperators = {
 contains: "Data containing values",
 notContains: "Data that does not contain values"
}

gridView.filterPanel.textOperators = textOperators;
```

<hr/>

### trimData

Clear spaces before and after the value and data entered in the input window and apply the filter.

`Type` - boolean

<hr/>

### visible

Whether filterPanel is visible

`Type` - boolean

<hr/>

## 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.

<hr/>