I am using the Kendo Grid from my Angular JS application and I have server paging working for large datasets. However I am trying to get Filtering and Sorting working and I have run into and issue with your library. When I enable filtering and sorting and monitor the URL request that is made from the grid in the browser it is as follows...
http://localhost:52442/api/samples?take=5&skip=0&page=1&pageSize=5&sort%5B0%5D%5Bfield%5D=Mid&sort%5B0%5D%5Bdir%5D=asc&filter%5Blogic%5D=and&filter%5Bfilters%5D%5B0%5D%5Bfield%5D=Name&filter%5Bfilters%5D%5B0%5D%5Boperator%5D=startswith&filter%5Bfilters%5D%5B0%5D%5Bvalue%5D=uuuu
so there is filter values being sent
however in my server side code both the Sorts and Filters properties on the dataSourceRequest are ALWAYS NULL.
Server Side Code is as follows
public GridPageResult<ReconciliationStatusModel> Get([FromUri]DataSourceRequest dataSourceRequest)
{
var items = Builder<ReconciliationStatusModel>.CreateListOfSize(100)
.Build().AsQueryable();
var resultFromDataSource = Json(items.ToDataSourceResult(dataSourceRequest));
var result = new GridPageResult<ReconciliationStatusModel>
{
Data = (IEnumerable<ReconciliationStatusModel>) resultFromDataSource.Content.Data,
TotalItems = 100,
PageNumber = dataSourceRequest.Page,
PageSize = dataSourceRequest.PageSize
};
return result;
}
Client side I have
$scope.mainGridOptions = {
toolbar: ["excel"],
excel: {
fileName: "Solar.xlsx",
allPages: true,
filterable: true
},
dataSource: {
//type: "json",
transport: {
read: "/api/samples",
dataType: "json"
},
pageSize: 5,
type: 'json',
serverPaging: true,
serverSorting: true,
serverFiltering: true,
schema: {
data: function (result) {
return result.Data;
},
total: function (result) {
return result.TotalItems || result.length || 0;
},
model: { ClientType: 'ClientType' }
}
},
filterable: {
extra: false,
operators: {
string: {
startswith: "Starts with",
eq: "Is equal to",
neq: "Is not equal to"
}
}
},
sortable: true,
pageable: true,
selectable: false,
dataBound: function () {
//this.expandRow(this.tbody.find("tr.k-master-row").first());
},
columns: [{
title: "Client Type",
field: "ClientType",
width: "50px",
filterable: {
messages: {
info: 'Show items custom message:'
}
}
etc..