DataGrid OData vs Virtualization filtering and sorting issue

Radzen.Blazor Components
1

Hi!

I made an attempt to combine example of OData

and Virtualization, but unfortunately fail with filtering. Investigation result shows, that parameter filter contains different values when virtualizaiton is on of off.

For example, with virtualization filter is: (LastName == null ? '' : LastName).ToLower().Contains('Davo'.ToLower()) which works fine with IQuarable but not with OData. And when it is false the filter value is contains(tolower(LastName),+tolower('Davo')) which is compatible with OData.

To simulate it is enough to replace line 4 of OData example with this one:
<RadzenDataGrid @ref="grid" @bind-Value=@selectedEmployees KeyProperty="EmployeeID" IsLoading="@isLoading" Count="@count" Data="@employees" LoadData="@LoadData" FilterPopupRenderMode="PopupRenderMode.OnDemand" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" FilterMode="FilterMode.Advanced" AllowSorting="true" AllowFiltering="true" AllowVirtualization="true" Style="height:400px" TItem="Employee" ColumnWidth="200px">
and perform some filtering or sorting.

2

You need to bind to ODataEnumerable as shown in our example:

3

Exactly in that example switch on virtualization, and try filtering.

<RadzenDataGrid @ref="grid" @bind-Value=@selectedEmployees KeyProperty="EmployeeID" IsLoading="@isLoading" Count="@count" Data="@employees" LoadData="@LoadData" FilterPopupRenderMode="PopupRenderMode.OnDemand" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" FilterMode="FilterMode.Advanced" AllowSorting="true" AllowFiltering="true" AllowVirtualization="true" Style="height:400px" TItem="Employee" ColumnWidth="200px">

image
image729×733 35.2 KB

to
image
image846×793 44.2 KB

and after run and filter you can see error in the browser development tools log:

I'm not allowed to add 3 images to show screenshot.

4

Aha, this way :slight_smile:

image
image1451×703 89.8 KB

5

Ok, the problem is with this guys:

image
image966×208 31.2 KB

So, when first render, Data is null, and if virtualization is allowed, Data is initialized with Enumerable.

After that, lazy property is checked in InvokeLoadData I assume,

image
image968×225 24 KB

where Data is not null (becasue of virtualizaiton on fisrt screenshot) and is initialized to false because is is not ODataEnumerable

image
image753×222 18.4 KB

The workaround can be not to use filter from arguments, but use same code as in argument preparation.

    async Task LoadData(LoadDataArgs args)
    {
        isLoading = true;
        
        var filter = grid.ColumnsCollection.ToODataFilterString();
        var result = await service.GetEmployees(filter: filter, top: args.Top, skip: args.Skip, orderby: args.OrderBy, count: true, expand: "Orders($expand=Customer)");
        // Update the Data property
        employees = result.Value.AsODataEnumerable();
        // Update the count
        count = result.Count;

        isLoading = false;
    }

As systematic, not breaking solution I can suggest to introduce optional parameter UseOData, and in setter initialize the field isOData.

Will try to handle it in github.

6

It will be fixed in our next update.

7

Thank you, I saw. Nice job!