# Row Filter

## Row-Filter Row

The Row-Filter Row of the DikeGrid enables a textbox for every defined column. To show the Row-Filter Row, we have to provide an input property called <mark style="color:orange;">`allowRowFiltering`</mark>.

Let us bind the related property from the `gridProperties` object to display the Row-Filter Row.

{% code title="grid-structure.component.html" %}

```markup
<dike-grid id="grid-structure"
    [allowRowFiltering]="gridProperties.allowRowFilter">
</dike-grid>
```

{% endcode %}

Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Filtering** group, and click on the **Row Filter** checkbox.

![Floating Configuration Panel - Filtering](/files/SXjKJrIWsM3RlDkZQN9s)

The following screenshot shows how the Row-Filter Row looks:

![Row Filter](/files/ron9wKbNYhiYIE5nxYx7)

Same as the Header, the Row-Filter Row occupies the full horizontal extension of the DikeGrid instance.

The highlighted Row-Filter Row represents only one column definition in the CSS grid layout specification. Therefore, the DikeGrid CSS grid layout will have three template columns when defining columns in all panels of the DikeGrid.

{% hint style="info" %}
See the [Panels' structure](/fundamentals/grid-structure/panels.md#content-panels) for more details.
{% endhint %}

Inside the Row-Filter Row comes the actual column filters definitions. The Row-Filter Row uses a nested CSS Grid Layout grid.

![Row Filters definitions](/files/eDz1WfCAAZzYgB07nbu8)

## Changing the Row-Filter Row height

By default, the Row-Filter Row has a height of **55 pixels**. Nevertheless, you can change this height by providing a numeric value to the input property called <mark style="color:orange;">`filterRowHeight`</mark>.

{% code title="grid-structure.component.html" %}

```markup
<dike-grid id="grid-structure"
    [allowRowFiltering]="gridProperties.allowRowFilter"
    [filterRowHeight]="gridProperties.filterRowHeight">
</dike-grid>
```

{% endcode %}

{% hint style="success" %}
You can also change the height of the Filter-Row Row by providing the Injection Token called <mark style="color:blue;">`FILTER_ROW_HEIGHT`</mark>.
{% endhint %}

In the previous code snippet, we added the <mark style="color:orange;">`filterRowHeight`</mark> property to the DikeGrid instance and was bound to the `gridProperties` object.

Open the [Floating Configuration Panel](/overview.md#floating-configuration-panel), go to the **Filtering** group, and type 80 in the **Row-Filter Row Height** textbox.

![Changing the Row Filter Row height](/files/x0mOmho6bOQkoIm1w6LE)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.dikesoft.com/fundamentals/grid-structure/row-filter.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.