Kendo MVC Grid controll cannot call to an Async Task action method in the controller

[Ronan]

In my cshtml view, I have this kendo mvc grid control below.

@(Html.Kendo().Grid<MyModel>()
  .Name("mygriddata")
  .Columns(column =>
  {
      column.Bound(model => model.MyData).Title("No.").....
  })
    .Pageable(x => x.PageSizes(true).ButtonCount(3).Responsive(false))
    .AutoBind(false)
    .Filterable()
    .Sortable(x => x.Enabled(true))
    .Resizable(resizable => resizable.Columns(true))
    .Scrollable(x => x.Height("auto"))
    .PersistSelection()
    .HtmlAttributes(new { style = "height: 50vh; margin-left:10px", @class = "form-group" })
    .NoRecords()
    .DataSource(dataSource => dataSource
        .Ajax()
        .ServerOperation(true)
        .Model(model =>
        {
            model.Id(item => item.ID);
        })
        .Read(read => read.Action("MyActionMethod", "MyController"))
    )
)

In in my controller, I have this async task action method.

public async Task<JsonResult> MyActionMethod([DataSourceRequest] DataSourceRequest request)
{
    var data = await _service.GetData();
     var model = data.Select((item, index) => new MyModel
                    {
                        MyData = ......
                    });

    return new JsonResult { Data = model.ToDataSourceResultAsync(request), MaxJsonLength = int.MaxValue, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
}

Then, when accessing the view, I got this error. How to set up the Kendo mvc grid control in this case?

Message: The asynchronous action method 'MyActionMethod' returns a Task, which cannot be executed synchronously.

[Mihaela]

Hello Ronan,

I would recommend updating the Action method as follows:

• Change the return type to Task<ActionResult>;
• Use the Json() method to return the result;
• Set the MaxJsonLength property on the JsonResult.

public async Task<ActionResult> MyActionMethod([DataSourceRequest] DataSourceRequest request)
{
    var data = await _service.GetData();
    var model = data.Select((item, index) => new MyModel
                    {
                        MyData = ......
                    });
    var resultData = model.ToDataSourceResult(request);
    var jsonResult = Json(resultData, JsonRequestBehavior.AllowGet);
    jsonResult.MaxJsonLength = int.MaxValue;
    return jsonResult;
}

Also, you can use the ToDataSourceResultAsync extension method to provide the asynchronous functionality of ToDataSourceResult by leveraging the async and await features of the .NET Framework. Here is KB article for you to review:

https://docs.telerik.com/aspnet-mvc/knowledge-base/grid-add-asynchronous-calls-to-action-methods

Let me know if the issue is resolved at your end.

 

Regards,
Mihaela
Progress Telerik