Telerik Forums / Kendo UI for jQuery
This is a migrated thread and some comments may be shown as answers.
Grid Filter and Sorting not Updating the grid
5 Answers 90 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Bulut
Top achievements
Rank 1
Bulut asked on 05 Sep 2018, 03:38 PM

In my web app I created a class DataSourceResult

 

/// <summary>
   /// DataSource result
   /// </summary>
   public class DataSourceResult
   {
       /// <summary>
       /// Extra data
       /// </summary>
       public object ExtraData { get; set; }
 
       /// <summary>
       /// Data
       /// </summary>
       public IEnumerable Data { get; set; }
 
       /// <summary>
       /// Errors
       /// </summary>
       public object Errors { get; set; }
 
       /// <summary>
       /// Total records
       /// </summary>
       public int Total { get; set; }
   }

 

and in my controller

 

[HttpPost]
        [AdminAntiForgery]
        public IActionResult PortList(DataSourceRequest command)
        {
            if (!_permissionService.Authorize(StandardPermissionProvider.ManageVendors))
                return AccessDeniedKendoGridJson();
 
            var ports = _worldPortIndexService.GetAllPorts(pageIndex: command.Page - 1, pageSize: command.PageSize);
            var model = ports.Select(p =>
            {
                var store = _worldPortIndexService.GetPortById(p.Id);
                return new PortMainModel
                {
                    Id = p.Id,
                    PortName = p.PortName,
                    UNLOCODE = p.UNLOCODE,
                    Country = p.Country,
                    LatDec = p.LatDec,
                    LonDec = p.LonDec
                };
            }).ToList();
 
            return Json(new DataSourceResult
            {
                Data = model,
                Total = ports.TotalCount
            });
        }

 

and my view script is

$(document).ready(function() {
    $("#ports-grid").kendoGrid({
        dataSource: {
            type: "json",
            transport: {
                read: {
                    url: "@Html.Raw(Url.Action("PortList", "PortGuideAdmin"))",
                    type: "POST",
                    dataType: "json",
                    data: addAntiForgeryToken
                },
                destroy: {
                    url: "@Html.Raw(Url.Action("Delete", "PortGuideAdmin"))",
                    type: "POST",
                    dataType: "json",
                    data: addAntiForgeryToken
                }
            },
            schema: {
                data: "Data",
                total: "Total",
                errors: "Errors",
                model: {
                    id: "Id"
                }
            },
            requestEnd: function (e) {
                if (e.type == "update") {
                    this.read();
                }
            },
            error: function(e) {
                display_kendoui_grid_error(e);
                // Cancel the changes
                this.cancelChanges();
            },
                pageSize: @(defaultGridPageSize),
                serverPaging: true,
                serverFiltering: true,
                serverSorting: true
        },
        pageable: {
            refresh: true,
            pageSizes: [@(gridPageSizes)],
            @await Html.PartialAsync("_GridPagerMessages")
        },
        editable: {
            confirmation: "@T("Admin.Common.DeleteConfirmation")",
            mode: "inline"
        },
        scrollable: false,
        columns: [{
            field: "Id",
            headerTemplate: "<input id='mastercheckbox' type='checkbox'/>",
            headerAttributes: { style: "text-align:center" },
            attributes: { style: "text-align:center" },
            template: "<input type='checkbox' value='#=Id#' class='checkboxGroups'/>",
            width: 50
        }, {
            field: "PortName",
            width: 200,
            title: "Port Name"
        }, {
            field: "UNLOCODE",
            width: 100,
            title: "UNLO CODE"
        },{
            field: "Country",
            width: 200,
            title: "Country"
        }, {
            field: "LatDec",
            width: 100,
            title: "Latitude"
        },{
            field: "LonDec",
            width: 100,
            title: "Longitude"
        }, {
                        field: "Id",
                        title: "@T("Admin.Common.Edit")",
                        width: 100,
                        headerAttributes: { style: "text-align:center" },
                        attributes: { style: "text-align:center" },
                        template: '<a class="btn btn-default" href="Edit/#=Id#"><i class="fa fa-pencil"></i>@T("Admin.Common.Edit")</a>'
                    }]
    });
});

 

when I turn filterable and sortable true filter and sorting is not updating my grid.Grid views list fine. all other functions are working except filtering and sorting.

5 Answers, 1 is accepted

Sort by
0
Georgi
Telerik team
answered on 07 Sep 2018, 12:19 PM
Hello Bulut,

I noticed that the dataSource is configured for server operations but the operations are not handled.

The Kendo.UI.Mvc.dll includes the ToDataSourceResult which will page, filter, sort, or group your data using the information provided by the grid. You can either use the ToDataSourceResult method or handle the requests manually.

The ToDataSourceResult method accepts a DataSourceRequest parameter which contains information about page, sort, group, and filter.

e.g.
        [AdminAntiForgery]
        public IActionResult PortList([DataSourceRequest]DataSourceRequest command)
        {
            if (!_permissionService.Authorize(StandardPermissionProvider.ManageVendors))
                return AccessDeniedKendoGridJson();
  
            var ports = _worldPortIndexService.GetAllPorts(pageIndex: command.Page - 1, pageSize: command.PageSize);
            var model = ports.Select(p =>
            {
                var store = _worldPortIndexService.GetPortById(p.Id);
                return new PortMainModel
                {
                    Id = p.Id,
                    PortName = p.PortName,
                    UNLOCODE = p.UNLOCODE,
                    Country = p.Country,
                    LatDec = p.LatDec,
                    LonDec = p.LonDec
                };
            }).ToList();
  
            return Json(model.ToDataSourceResult(command));
        }


Regards,
Georgi
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Bulut
Top achievements
Rank 1
answered on 08 Sep 2018, 04:24 PM
Do you have kendo.mvc nuget package for ASP.NET Core 2.1 and EF Core 2.1? The one I found is not going to work for my project.
0
Georgi
Telerik team
answered on 11 Sep 2018, 01:19 PM
Hello Bulut,

Our latest Telerik UI for ASP.Net Core nuget package (2018.2.620) is compatible with Core 2.1.

Are you facing any issues using it?


Regards,
Georgi
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Bulut
Top achievements
Rank 1
answered on 11 Sep 2018, 02:25 PM
yes. How can I use [DataSourceRequest] in my controller? only working option is Kendo.MVC but it is not compatible with my project. having problem with model bindings.
0
Konstantin Dikov
Telerik team
answered on 13 Sep 2018, 11:39 AM
Hello Bulut,

Please refer to the following help topic for detailed information about the AJAX binding of the Grid for ASP.NET Core:
If further assistance is needed, please do not hesitate to contact us again.


Regards,
Konstantin Dikov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Bulut
Top achievements
Rank 1
Answers by
Georgi
Telerik team
Bulut
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or