How to search data column when columns are grouped in datagrid.
Hello support team, I am using the group function of datagrid and filter. The problem I'm having is that when I group a column it hides the search bar. How can I show the search bar again?
Below is my code.
Link: https://blazorplayground.syncfusion.com/embed/hDrytWMKhJPXTOZg?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5
<GridFilterSettings Type="FilterType.FilterBar" Mode="FilterBarMode.OnEnter"></GridFilterSettings>
<GridGroupSettings Columns="@Initial" />
I have another question: how to assign FilterSettings="@(new FilterSettings{ Operator = Operator.Contains })"
For all columns without having to assign them manually. Thank you!!!
Hi Chang,
Query 1: When I group a column it hides the search bar.
Upon reviewing your query, it appears that you would like the filter bar of a column to remain visible even when the corresponding column is grouped. By default, when a column is grouped in the DataGrid, it gets hidden from the UI.
To address this, you can use the ShowGroupedColumn property under GridGroupSettings. Setting this property to true ensures that the grouped column remains visible in the UI, meeting your requirement.
Code Snippet:
|
<GridGroupSettings Columns="@Initial" ShowGroupedColumn="true"></GridGroupSettings>
|
Query 2: How to assign FilterSettings="@(new FilterSettings{ Operator = Operator.Contains })" for all columns
|
<SfGrid DataSource="@Orders" @ref="Grid" AllowFiltering AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Height="315"> <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings> <GridEvents OnLoad="LoadHandler" TValue="Order"></GridEvents> </SfGrid>
@code { public List<Order> Orders { get; set; }
SfGrid<Order> Grid { get; set; }
public void LoadHandler(object args) { foreach (var column in Grid.Columns) { if (column.Type == ColumnType.String) { column.FilterSettings = new FilterSettings { Operator = Syncfusion.Blazor.Operator.Contains }; } } } }
|
We have also attached a sample below for your reference. Please take a look, and let us know if you have any questions or need further assistance.
Regards,
Sanjay Kumar Suresh
Thanks, it work for me 🎉🎉. You are the best Sanjay Kumar Suresh!!!.
Hi Chang,
We are happy to hear that the provided solution was helpful. Please get back to us if you need any other assistance.
Regards,
Sanjay Kumar Suresh
- 3 Replies
- 2 Participants
-
CN Chang Nguyen Phuong
- Jan 13, 2025 06:55 AM UTC
- Jan 15, 2025 06:23 AM UTC