DataSourceRequest.sort is null

[Ankit]

Hi friends,

I am trying to work with ajax on Kendo UI grid but the DataSourceRequest.sort property is always null to me.

Here is my grid:-
@(Html.Kendo().Grid<MvcApplication1.Utility.

Employee>()
.Name("Grid")
.EnableCustomBinding(true) .
Columns(columns => { 
    columns.Bound(p => p.EmpId).Groupable(false);
    columns.Bound(p => p.EmpName); 
    columns.Bound(p => p.EmpDepartment);
    columns.Bound(p => p.EmpSal);
})
.Sortable()
.Scrollable()
.Filterable()
.DataSource(dataSource => dataSource
.Ajax().Events((events => events.Error("onError")))
.Read(read => read.Action("Employee_Read", "Home"))
.ServerOperation(true) ) ) 

My Code behind:-

public JsonResult Employee_Read([DataSourceRequest]DataSourceRequest request) 
{ 
var employees = GetEmployeeData();
DataSourceResult result = employees.ToDataSourceResult(request);
return Json(result, JsonRequestBehavior.AllowGet);
}

Please note that Employee class is not IQueryAble.

Please suggest suitable solution.

Regards,
Ankit Verma

 

 

[Anton]

Same Problem.
You can clearly see that Grid is sending sort parameters:

1. Query String Parametersview URL encoded
   1. take:
      10
   2. skip:
      0
   3. page:
      1
   4. pageSize:
      10
   5. sort[0][field]:
      incident_num
   6. sort[0][dir]:
      desc

But when the action is called in
public ActionResult GridData_X([DataSourceRequest]DataSourceRequest request)

request.Sorts is null..

[Redfa]

Same Problem. 
How to decide?

[Jo]

I have just ran into the same issue. Is there any news on this? We are evaluating control libraries and sorting/paging are mandatory requirements for the framework we pick.

Some more details:
*Paging works perfectly fine, it's the other operations like filter and sort that do not work
*The GET gets performed, but the databinding with the DataSourceRequest does not seem to work.

View:

@{

    Html.Kendo().Grid(Model)

        .Name("Grid")

        .DataSource(dataSource => dataSource

            .Ajax()

            .Read(read => read.Action("Packages", "Package"))

            .PageSize(24)

        )

        .Columns(columns =>

            {

                columns.Bound(pkg => pkg.Barcode).Title(Global.Package_Barcode);

            })

        .Pageable()

        .Sortable()

        .Filterable()

        .Render();

}

Controller:

[HttpGet]

    public ActionResult Kendo()

    {

        return View();

    }

 

    [HttpGet]

    public ActionResult Packages([DataSourceRequest] DataSourceRequest request)

    {

       //request.sorting etc. is NULL here

         

        return Json(GetPackages().ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

    }

Any ideas on what this piece of code is missing?

[Atanas Korchev]

Hi,

 This would happen if kendo.aspnetmvc.min.js is not included in your page. I recommend checking the getting started instructions for further information.

Kind regards,
Atanas Korchev
the Telerik team

[Jo]

Hi,

The tips you gave me solved my problem.
Things I had overlooked:

• Including kendo.aspnetmvc.js
• Explicitly telling the datasource read to perform a GET:

.DataSource(dataSource => dataSource

    .Ajax()

    .Read(read =>

            {

                read.Type(HttpVerbs.Get);

                read.Action("Packages", "Package");

            }

    )

)

Thank you for your swift response.

Jo

[Brian]

I've been banging my head against this for 2 days now.
I have the recommended js files in the correct order in my Layout, and they are showing up as scripts in Firebug.

    <script src="@Url.Content("~/Scripts/kendo/2013.2.716/jquery.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.web.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2013.2.716/kendo.aspnetmvc.min.js")"></script>

I also have explicitly set my Read.Type to "GET"

.Read (read => read.Action ("Read", "GridSettings").Type(HttpVerbs.Get))

And I have the requisite Parameter type and annotation in my controller:

        public ActionResult Read([DataSourceRequest] DataSourceRequest request) {
            using (var db = new ShowServicesContext()) {
                IQueryable<Setting> settings = db.Settings;
                DataSourceResult result = settings.ToDataSourceResult (request);
                return Json (result, JsonRequestBehavior.AllowGet);
            }
        }

Yet when I debug the controller and inspect the request parameter, Sorts is null.
These are the parameters that are getting passed:

page:1
pageSize:10
skip:0
sort[0][compare]:
sort[0][dir]:desc
sort[0][field]:Value
take:10

I have an MVC4 project on .NET 4.0, Kendo version 2013.2.716 Trial Version and the version on my Kendo.Mvc.dll file is 2013.2.716.340

I added Kendo via the Telerik menu on my Visual Studio. Everything works except Sorting and Filtering. The options all come back as null in the request.

At my wits end on this.

[Daniel]

Hello,

The code that you provided is correct. Could you provide the complete code for the view and the layout so I can check the complete setup?

Regards,
Daniel
Telerik

[Lorenzo]

...same exact problem here !
Just updated to the very latest Kendo Kendo UI Complete v2013.2.716 (though might be a problem related to the older version I was using...nop!)

The request contains the right parameters:
filterStr:|#From:01/07/2013#||#To:27/08/2013#|           <-- ## This in my Stuff!
take:30
skip:0
page:1
pageSize:30
sort[0][field]:salesPerson
sort[0][dir]:asc
sort[0][compare]:

The javascript code is:

var dataSource = new kendo.data.DataSource({

            transport: {

                read: {
                    type: "POST",
                    url: '@Url.Action("getOrderList", "Order")',
                    data: getFilter()
                }
            },
            serverPaging: true,
            pageSize: 30,

            serverSorting: true,

            schema: {
                data: "Data",
                total: "Total"
            }


        });


        $("#orderListGrid").kendoGrid({
            dataSource: dataSource,

            columns: [
                { field: "idOrder", title: "num. Ordine", width: "100px" },
                { field: "dateOrderTxt", title: "Data CC", width: "80px" },
                { field: "salesPerson", title: "SVS", width: "140px" },
                { field: "customerName", title: "Cliente" },
                { field: "dealerName", title: "Cliente" },
                { field: "FattNett", title: "Fatt.", format: "{0:C2}" }
            ],

            sortable: true,

            pageable: true,

            height: 400

        });

The controller is:

public JsonResult getOrderList([DataSourceRequest]DataSourceRequest request, string filterStr)
       {

           /* 27/08/2013

            */


           orderListFilter filter = new orderListFilter();
           if (filterStr.Contains("|#From:"))
           {
               filter.startDate = Convert.ToDateTime(filterStr.Substring(filterStr.IndexOf("|#From:") + 7, 10));
           }.....etc.

The request parameter has the "sort" == null !

Before the JavaScript Object approach I was using the ASP NET MVC Helper and didn't have any problem. Since I needed to try a more "platform independent" approach  I moved to the pure JavaScript Object. The binding is (and was) a custom binding so I'm handling both sorting and paging server side, but right now I cannot get the parameters for the sorting. Paging is working.
Please HELP !

Lorenzo 

[Daniel]

Hello Lorenzo,

I posted my reply in the support ticket. For convenience I am pasting it below:

You should set the dataSource type to be "aspnetmvc-ajax"  in order for the values to be formatted as expected by the DataSourceRequestAttribute:

var dataSource = new kendo.data.DataSource({
    type:"aspnetmvc-ajax"

Regards,
Daniel
Telerik

[Reza]

Hi
I have had the same problem, but I changed kendo.web.min.js to kendo.all.min.js and problem is solved.

[Seamus]

I am using json request in angularjs to my API Controller so 

 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;
                }
            }
        },

 

The controller method looks like this 

public GridPageResult<ReconciliationStatusModel> Get([FromUri]DataSourceRequest dataSourceRequest)

 

however as people have stated PAging works fine but the Sorts and Filter are always null 

 

If I interrogate the url I can see the Sorts set 

 

http://localhost:52442/api/samples?take=5&skip=0&page=1&pageSize=5&sort%5B0%5D%5Bfield%5D=Coper&sort%5B0%5D%5Bdir%5D=asc

 

Would be grateful if the Telerik Team could respond and confirm if this is an issue in the library

[Kamal]

Hello friends,

Iam working on implementing server side paging sorting filtering in kendo grid but the dataSourceRequest paramter's pagesize and sort property is showing null always even when i've enabled serverOperation true in my razor page,Below I'm Posting whole code :

 

<script>
    $('#grid').kendoGrid({
        //searchable: true,
        //sortable: true,
        //filterable: true,
        pageable : true,
        columns: [
        { field: "FirstName", filterable:false },
        { field: "LastName" },
        { field: "Gender" },
        {field:"JobTitle"}
        ],
        dataSource: {
            transport: {
                read: {
                    url: "/Home/getData"
                }
            },
            ServerOperation: true,
            PageSize:10
        }
    });
</script>

 

Controller Method:

using Kendo.Mvc.UI;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Kendo.Mvc.Extensions;
    
namespace KendoGrid1.Controllers
{
    public class HomeController : Controller
    {
        EmployeeDBEntities context = new EmployeeDBEntities();

        // GET: Home
        public ActionResult Index()
        {
            return View();
        }
        public JsonResult getData([DataSourceRequest] DataSourceRequest request)
        {
            var data = context.tblEmployeesDs.AsQueryable();
            data = data.Take(request.PageSize);
            DataSourceResult result = data.ToDataSourceResult(request);
            return Json(data, JsonRequestBehavior.AllowGet);
        }
    }
}

[Dimo]

Hello Kamal,

DataSourceRequest and ToDataSourceResult() are designed to be used with the MVC wrapper of the Kendo UI Grid, configured for Ajax binding.

http://docs.telerik.com/aspnet-mvc/helpers/grid/binding/ajax-binding

In addition, there is no ServerOperation property for the JavaScript Grid configuration syntax. A property with this name exists in the server-side syntax:

http://docs.telerik.com/aspnet-mvc/helpers/grid/binding/ajax-binding#enable-client-data-processing

In the client-side configuration syntax, there are several different properties related to server-side data operations - serverPaging, serverSorting, etc:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-serverPaging

All of these should be set to the same value:

http://docs.telerik.com/kendo-ui/framework/datasource/overview#mixed-data-operations-mode

Regards,
Dimo
Telerik by Progress

[Kamal]

Thanks for reply!But that code of mine worked when i loaded aspnetmvcminjs file and specified the type of kendo Data Source as aspnetmvc-ajax.

[Dimo]

Hi Kamal,

Yes, it is possible to use the approach that you have chosen, although it is not officially documented or supported.

Regards,
Dimo
Telerik by Progress