Skip to content

Commit ba15067

Browse files
docs(grid): update filtering docs
1 parent eb5e2bf commit ba15067

File tree

7 files changed

+9
-7
lines changed

7 files changed

+9
-7
lines changed

components/grid/filtering.md

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,9 @@ You can filter more than one column at a time, and all filter rules will be appl
2525

2626
## Filter Row
2727

28-
The grid will render a row below the column headers with UI that you can use to fill in the filter criteria. You can click outside of the filter to execute the default operator, or click a button to choose a different filter operator (like "contains", "greater than" and so on).
28+
The filter row is the default filter behavior of the grid. It corresponds to setting the `FilterMode` property of the grid to `Telerik.Blazor.FilterMode.FilterMenu`.
29+
30+
The grid will render a row below the column headers with UI that you can use to fill in the filter criteria. You can type in the input to execute the default operator as you type, or click a button to choose a different filter operator (like "contains", "greater than" and so on).
2931

3032
Once a filter is a applied to a column, a button will appear that lets you clear that filter.
3133

@@ -76,17 +78,17 @@ Once a filter is a applied to a column, a button will appear that lets you clear
7678

7779
>caption The result from the code snippet above, before and after the user filled in a filter and clicked on the filter button
7880
79-
![](images/filterable-grid.png)
81+
![](images/filter-row-1.png)
8082

81-
![](images/filtered-grid.png)
83+
![](images/filter-row-filtered.png)
8284

8385
## Filter Menu
8486

8587
To use a filter menu, set the `FilterMode` property of the grid to `Telerik.Blazor.FilterMode.FilterMenu`.
8688

8789
The grid will render a button in the column header that you click to get a popup with filtering options. The popup lets you choose filter operator, filter criteria, to apply and clear the filter.
8890

89-
A key difference in the behavior is that the filter is now applied only upon a button click, not upon input change. This may improve performance if you use [manual CRUD operations]({%slug components/grid/manual-operations%}) by reducing the number of requests.
91+
A key difference in the behavior from the [filter row](#filter-row) is that the filter is now applied only upon a button click, not upon input change. This may improve performance if you use [manual CRUD operations]({%slug components/grid/manual-operations%}) by reducing the number of requests.
9092

9193
>caption Filter Menu in Telerik Grid
9294
@@ -136,11 +138,11 @@ A key difference in the behavior is that the filter is now applied only upon a b
136138

137139
>caption The result from the code snippet above, after the "Age" column has been filtered with <= 30 operator.
138140
139-
![](images/filterable-grid-filter-menu.png)
141+
![](images/filter-menu-1.png)
140142

141143

142144
## See Also
143145

144-
* [Live Demo: Grid Filtering](https://demos.telerik.com/blazor-ui/grid/filtering)
145-
146+
* [Live Demo: Grid Filter Row](https://demos.telerik.com/blazor-ui/grid/filter-row)
147+
* [Live Demo: Grid Filter Menu](https://demos.telerik.com/blazor-ui/grid/filter-menu)
146148

36.4 KB
Loading
52.5 KB
Loading
34.4 KB
Loading
-37.2 KB
Binary file not shown.
-54.1 KB
Binary file not shown.
-34.3 KB
Binary file not shown.

0 commit comments

Comments
 (0)