Tayyab
Tayyab

Reputation: 1217

Kendo UI jQuery Grid Server Side Filtering

I am using Kendo UI for jQuery Grid to display some data. So far I am using Client Side Filtering and Paging where all the data records were returned in the initial call to the server (Web API and Dapper are being used at server side). However, the idea of getting all the data in a single call from the server is no more feasible as the Datasource has grown with time.

I have enabled the option for server-side paging and filtering using the following:

serverPaging: true,
serverSorting: true,
serverAggregates: true,
serverFiltering: true,

The filters and paging information is being passed as query parameters like:

take: 20
skip: 0
page: 1
pageSize: 20
filter[logic]: and
filter[filters][0][logic]: or
filter[filters][0][filters][0][value]: High
filter[filters][0][filters][0][operator]: eq
filter[filters][0][filters][0][field]: status
filter[filters][0][filters][1][value]: Medium
filter[filters][0][filters][1][operator]: eq
filter[filters][0][filters][1][field]: status
filter[filters][1][logic]: and
filter[filters][1][filters][0][field]: Name
filter[filters][1][filters][0][operator]: startswith
filter[filters][1][filters][0][value]: a
filter[filters][1][filters][1][field]: Name
filter[filters][1][filters][1][operator]: contains
filter[filters][1][filters][1][value]: a

So first issue we are facing is trying to map these filters and other parameters to some Kendo provided DTO (we have used Kendo MVC controls DataSourceRequest class) but the filters never gets mapped to that properly. Also I know the use of [FromUri] and [FromBody] options so no need to mention any such solution :)

Next concern that I have is that even though somehow (assumption for now) I am able to properly map the filters and other parameters to some DTO how can we actually use these filters on our data source, which in fact is made up from a Dapper SQL query.

Also I would also want to avoid manual filter parsing and generating a dynamic where clause.

As far as Kendo documentation is concerned although there is a workable demo of such sort but the server functionality is either not there or the one available has not been of much use to us like the following:

    public ActionResult Remote_Binding_Orders_Read([DataSourceRequest]DataSourceRequest request)
    {
        return Json(GetOrders().ToDataSourceResult(request));
    }

As already mentioned when tried such from the Kendo jQuery Grid the filters never gets mapped to the DataSourceRequest.

Yet again the following code would also be not of much help as we are using Dapper:

public static IQueryable<OrderViewModel> ApplyOrdersFiltering(this IQueryable<OrderViewModel> data, IList<IFilterDescriptor> filterDescriptors)
{
    if (filterDescriptors != null && filterDescriptors.Any())
    {
        data = data.Where(ExpressionBuilder.Expression<OrderViewModel>(filterDescriptors, false));
    }
    return data;
}

orders = orders.ApplyOrdersFiltering(request.Filters);

If anybody had the same issue and found some workaround then such help would be much appreciated.

Note: Changing from Dapper to Entity Framework is not an option, and the same also applies to Kendo jQuery Grid.

Upvotes: 3

Views: 2368

Answers (1)

Tayyab
Tayyab

Reputation: 1217

After all was not able to find some workaround (even the telerik support just went round and round and was not able to suggest any work around).

So decided for a custom implementation (also created a sweet nuget for any and all developers that may run into the same).

Thus had to manually generate expressions that can be used for creation of dynamic WHERE, ORDER BY, GROUP BY and SELECT (for aggregation) clauses.

For further detail please refer to the following repository: KendoGridFASMS

Also the nuget package: Nuget Package

Also the repository is open to all for further customization :)

As of March 16 2020:

The library now supports .NET Core and .NET Standard Frameworks as well.

Upvotes: 2

Related Questions