Filtering Items from a multicolumn dropdown in a grid

[chris johansson]

I have a grid with a multicolumn combo box.  I am wondering if there is a better way to filter data where there are hundreds of thousands of records from the database.

I tried pull the entire list upon initialization but it was so slow to open up the combo box to load everything.  Instead I ended up pulling a limit of 100 records based on the filter in the function and then filtered based on both columns. Sometimes its a bit glitchy and when i backspace it puts back that number occasionally. Wondering if there is a better way to filter and handle big data from multicolumn combo boxes. Thanks

ps is there a way to post code and properly format it in here?

    public async Task onFilteringItemID(Syncfusion.Blazor.DropDowns.FilteringEventArgs args)

    {

        args.PreventDefaultAction = true;

        var pre = new WhereFilter();

        var predicate = new List<WhereFilter>

            ();

        predicate.Add(new WhereFilter() { Condition = "or", Field = "itemid", value = args.Text, Operator = "contains", IgnoreAccent = true, IgnoreCase = true });

        predicate.Add(new WhereFilter() { Condition = "or", Field = "NameAlias", value = args.Text, Operator = "contains", IgnoreAccent = true, IgnoreCase = true });

        pre = WhereFilter.Or(predicate);

        itemQuery = args.Text == "" ? new Query() : new Query().Where(pre);

        if (args.Text != "")

        {

            string GetItemIDSearch = "FDI/GetItemIDSearch/%" + args.Text + "%";

            ItemIDs = await httpClient.GetJsonAsync<List<FDIItemID>>(GetItemIDSearch); //calls rest API to get 100 max

        }

        await this.comboboxItemID.Filter(ItemIDs, itemQuery);

    }

[Jeevakanth Palaniappan]

Hi Chris, 

Greetings from Syncfusion support. 

We have validated your reported query. We have already logged the virtual scrolling support as a feature in our end. It will be included in our any one of upcoming release. We appreciate your patience until then.  You can tract the status of the feature in the below feedback link.   

   

Feedback link: https://www.syncfusion.com/feedback/13013  

   

Also, you can achieve the performance improvement by initially loading limited items in the popup using the ‘take’  property. Also by enabling the AllowFiltering property, will helps you to search the non-listed items from the popup. We suggest you to use the below work-around solution until the virtualization feature implement.   

<SfComboBox @ref="ComboBoxObj" TItem="GameFields" TValue="string" AllowFiltering="true" Query="@Query"PopupHeight="230px" Placeholder="Select a game" @bind-Value="@DropVal" DataSource="@Games">  

    <ComboBoxEvents TValue="string" Filtering="OnFiltering"></ComboBoxEvents>  

    <ComboBoxFieldSettings Text="Text" Value="ID"></ComboBoxFieldSettings>  

</SfComboBox>  

@code {  

  

    public Query Query = new Query().Take(5);  

    ...  

    public void OnFiltering(FilteringEventArgs args)  

    {  

        args.PreventDefaultAction = true;  

        var query = new Query();  

        if (args.Text != "")  

        {  

            query = new Query().Where(new WhereFilter()  

            {  

                Field = "Text",  

                value = args.Text,  

                Operator = "startswith",  

                IgnoreCase = true  

            });  

        }  

        else  

        {  

            query = new Query().Take(5);  

        }  

  

        this.ComboBoxObj.Filter(Games, query);  

    }  

}  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Combobox94381585  

Regards, 

Jeevakanth  SP. 

[Jeyanth Muthu Pratheeban Sankara Subramanian]

Hi Chris,

 

We have provided virtual scrolling support for Combobox and Dropdownlist in 2020 Volume 3. To enable virtual scrolling, EnableVirtualization property to be set as true. We suggest you to upgrade the Syncfusion packages to the latest for this support. Please find the release notes below. 

 

Combobox         : https://blazor.syncfusion.com/documentation/release-notes/18.3.35/?type=all#combobox 

Dropdownlist    : https://blazor.syncfusion.com/documentation/release-notes/18.3.35/?type=all#dropdownlist 

 

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance. 

 

Regards,  

Jeyanth.