datasource ajax kendo grid after document ready because model not correctly bound on partial view

Question

I have a problem related to the data binding of a kendo grid. This grid is in a partial view which is bound to an object model. The grid is also bound to a refresh action on my controller as follows:

@(Html.Kendo().Grid<GridModel>()                
     .DataSource(dataSource => dataSource
                    .Ajax()
                    .Read(read => read
                        .Action("MyMethod", "MyController")
                        .Data("getViewModel")
                    )
       )   
    )

The getViewModel is defined as follows. It sends the object model of the partial view back to the MyMethod in MyController

function getViewModel() {
    return @Html.Raw(JsonConvert.SerializeObject(new {myModel=Model}));
}

Every time the partial view is loaded, the grid is making a call to MyMethod in MyController and it is passing the object model that the partial view is associated with. This is the method implementation

public JsonResult MyMethod([DataSourceRequest] DataSourceRequest request, MyModel myModel)
    {
        var result = null;
        switch(myModel.MyParameter){
          case "1": 
             result = someMethod();
             break;
          case "2": 
             result = someOtherMethod();
             break;
        }          
        return Json(result);
    }

As you can see, the result that is being sent to the grid depends on the value of the model sent to the method.

So, the very first time that I call my partial view the object model is read by the "getViewModel" and sent back to MyMethod. HOWEVER I have implemented some AJAX calls so that the partial view is invoked again but this time with a different object model parameter. This should cause that when the "getViewModel" is invoked the model sent to MyMethod should change to the new model and therefore retrieve different data for the grid.

public ActionResult AuxMethod(int id)
    {
        var newModel = new MyModel();
        return  PartialView("_kendoGrid", newModel);
    }

However I have noticed this is not happening as the "getViewModel" is sending the previously bound model to MyMethod. It makes the call and after that it actually changes the model bound to the partial view in which the kendo grid is.

I have seen this, because the "getViewModel" is being called BEFORE the $(document).ready() function. Inside the document ready I am actually getting the new value for the partial view model but the call to the MyMethod is happening before and not reading the correct value.

My questions are:

1. Is there any way to make the datasource binding of the kendo grid to happen AFTER the document ready function?
2. Or is there any way in which I can ensure that the new model has been bound to the partial view BEFORE calling the datasource method?

Thanks!

EDIT: I have solved the problem the answer is the following:

1. Add AutoBind(false) to the grid.
2. On the document ready read the model from the view (in order to update it) and assign it to a variable
3. read the data source

4. Define the datasource data function accordingly

   @(Html.Kendo().Grid() .AutoBind(false)
   .DataSource(dataSource => dataSource .Ajax() .Read(read => read .Action("MyMethod", "MyController") .Data("getViewModel") ) )
   )

The following is the script

var currentModel;
var kendoGrid;

function getViewModel() {
    return currentModel;
}

$(document).ready(function () {        
    currentModel = getModel();
    $('#kendoGrid').data('kendoGrid').dataSource.read();
});

function getModel() {
    return @Html.Raw(JsonConvert.SerializeObject(Model));
}

Answer 1

You are never updating the model you are passing to your view. You are just returning a JSON result to your grid but your view still holds the original model. This is why getViewModel() returns the original model.

What you want to do is create a client-side viewmodel (perhaps using something like Knockout or whatever you feel comfortable with) and bind it to the model that is passed into the view. This way, when your viewmodel is changed, the model will be updated as well.