Prepopulating Grid with Filter

[Jim]

I have a grid in an MVC view, and upon a button click i am sending its DataSource info to the controller via the parameterMap() and an ajax() posting.  something like this:

function sendData() {
    var grid = $("#Grid").data("kendoGrid"),
        parameterMap = grid.dataSource.transport.parameterMap;

    var data = parameterMap({ sort: grid.dataSource.sort(), filter: grid.dataSource.filter(), group: grid.dataSource.group() });
    $.ajax({
        url: "/Home/UpdateCreateDelete",
        data: data,
        type: "POST",

This works great, the controller gets the datasourcerequest info.  I can use the DataSourceRequest fields to send them later on back to a view with a grid and i can initialize that grid to use the DataSourceRequest fields like this:

// note grid.autobind() set to false, so we can load upon dom ready below:

 

$(function() {

   @{ var request = TempData["request"] as DataSourceRequest;  }

    var grid = $("#mygrid").data("kendoGrid");
​   grid.dataSource.query({

           page:  @request.Page,            // WORKS PERFECTLY!


           pagesize: @request.PageSize,      // WORKS PERFECTLY!


           filter: null,                // FAILS IF I use filter: @request.Filter

           sort:  null,                 // FAILS IF I use sort: @request.Sort

           group: null,                 // FAILS IF I use group: @request.Group 

     });

}

The problem is that the loading does not support the filters, sorts, or groups fields from the DataSourceRequest object.  How do i convert those DataSourceRequest fields into something that is in proper format for the the Grid.query() function?


Bottom line is that i want to be able to initialize my grid with the filters, sorts, and groupings that were saved from a previous DataSourceRequest.

[Dimo]

Hello Jeff,

@request.Page and @request.PageSize represent scalar numeric values, that's why they work in your case. However, the other three parameters represent server-side objects, which can't be transformed to the required client-side Javascript objects automatically. You need transform and serialize them manually before sending them to the client, and then deserialize them in order to obtain the required client-side object with a structure, which is described in the documentation:

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-query

Generally, if you preserve the information, which is initially sent from the client (e.g. grid.dataSource.filter() ), it will be easier for you to return it to the client in the same format.

Regards,
Dimo
Telerik