How to search multiple column

[Ahmed Mosaad]

Hi Support,

I am using blazor syncfusion grid like in this demo https://blazor.syncfusion.com/demos/datagrid/search

the search works fine as shown in image below 

but if I want to filter more results on Inventor Name & Country it shows empty results. It works only for single Column. how should I support searching by multiple keywords for different columns

Thanks

Ahmed

[Naveen Palanivel]

Hi Ahmed,

We regret to inform you that it is not possible to search for multiple column values using the built-in search functionality. As an alternative, we recommend using the Grid’s Query property. You can generate predicates using the WhereFilter method and then pass the generated predicates to the Grid’s Query property to perform search operations. Please refer the code snippet and sample for your reference.

Sample : https://blazorplayground.syncfusion.com/embed/VZLoXcsSqPYPzxmQ?appbar=true&editor=true&result=true&errorlist=true&theme=bootstrap5

<SfGrid @ref="Grid" DataSource="@Orders" Query="SearchQuery" AllowPaging="true" Height="200">

    <SfToolbar>

        <ToolbarItems>

            <ToolbarItem Type="ItemType.Input" Align="Syncfusion.Blazor.Navigations.ItemAlign.Right">

                <Template>

                    <SfTextBox @ref="SearchBoxObj" ShowClearButton="true" Placeholder="Search" Width="300px"

                               ValueChange="ValueChange" Created="AddSearchIcon">

                    </SfTextBox>

                </Template>

            </ToolbarItem>

        </ToolbarItems>

    </SfToolbar>

 

    <GridColumns>

        <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" Width="120"></GridColumn>

    </GridColumns>

</SfGrid>

 

@code {

    SfTextBox SearchBoxObj;

    public SfGrid<Order> Grid;

    public List<Order> Orders { get; set; }

    public Query SearchQuery { get; set; }

 

    WhereFilter ColumnPredicate = new WhereFilter();

    List<WhereFilter> Predicate = new List<WhereFilter>();

 

    public void AddSearchIcon()

    {

        this.SearchBoxObj.AddIconAsync("append", "e-icons e-search-icon");

    }

 

    public async Task ValueChange(Syncfusion.Blazor.Inputs.ChangedEventArgs args)

    {

        string searchValue = args.Value?.ToString() ?? string.Empty;

 

        var keys = searchValue.Split(',');

        string[] columnsToSearch = { "OrderID", "CustomerID", "Freight" };

 

        Predicate.Clear();

 

 

        foreach (var column in columnsToSearch)

        {

            foreach (var key in keys)

            {

                Predicate.Add(new WhereFilter()

                    {

                        Field = column,

                        value = key,

                        Operator = "startswith",

                        IgnoreCase = true

                    });

            }

 

        }

 

 

        ColumnPredicate = WhereFilter.Or(Predicate);

        SearchQuery = new Query().Where(ColumnPredicate);

 

        await Grid.Refresh();

    }

}

Regards,
Naveen