CODEWITHSUNDEEP
c#.netkendo-uikendo-gridkendo-asp.net-mvc
dhamilton
dhamilton

Reputation: 173

Kendo UI Grid not populating after call to read

OK I have another and I'm sure I'm missing something simple again. Populating the Kendo Grid with a json result set. The load is triggered by a selection from a kendo dropdownlist control. I can see the data is returned from my webapi and converted to the json result. But the data is not displayed in the grid.

What I'm missing doing wrong?

Here is how grids view is added:

<div id="messageGridArea">
    @Html.Partial("Messages")
</div>

Here is dropdownlist definition:

@(Html.Kendo().DropDownList()
    .Name("importDates")
    .CascadeFrom("clients")
    .OptionLabel("Select Import Date...")
    .DataSource(source => {
        source.Read(read =>
        {
            read.Action("GetDistinctImportDates", "Home").Data("filterImportDates");
        })
        .ServerFiltering(true); 
     })
     .AutoBind(false)
     .Enable(false)
     .Events(e => e.Change("OnImportDatesChanged"))
)

Here is filter for grid parameters:

function filterGridMessages() {
    return { importdate: $("#importDates").val() };
}

Here is event to populate the grid:

function OnImportDatesChanged(e) {
    var grid = $("#clientMessages").data("kendoGrid");
    grid.dataSource.read();
}

Here is the grid definition:

@(Html.Kendo().Grid<Pulse.Data.Model.ImportHeader>()
    .Name("clientMessages")
    .AutoBind(false)
    .Filterable()
    .Groupable()
    .Sortable()
    .Pageable()
    .Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(p => p.ImportId))
        .ServerOperation(false)
        .Read(read =>
            read.Action("GetImportMessages", "Home").Data("filterGridMessages")
         )
    )
    .Columns(columns =>
    {
        columns.Bound("ImportStatus").Title("I").Width("3%");
        columns.Bound("ImportTime").Title("Import Time");
        columns.Bound("RecordStatus").Title("Status").Filterable(true).Sortable(true).Width("7%");
        columns.Bound("RecordState").Title("State").Filterable(true).Sortable(true).Width("7%");
        columns.Bound("RecordAction").Title("Action").Filterable(true).Sortable(true).Width("7%");                
    })
)

And finally here is the controller code to read the data:

public JsonResult GetImportMessages(string importdate)
{
    IEnumerable<ImportHeader> messages = null;
    var msgs = client.GetStringAsync(string.Format("api/importheaders?$filter=RecordSource eq '{0}'", importdate)).Result;
    if (!string.IsNullOrWhiteSpace(msgs))
        messages = JsonConvert.DeserializeObject<IEnumerable<ImportHeader>>(msgs);
    return Json(messages, JsonRequestBehavior.AllowGet);
}

Upvotes: 3

Views: 2593

Answers (1)

Nic
Nic

Reputation: 12846

A grid requires a DataSourceResult.

You should get something like this (have not tested it):

public JsonResult GetImportMessages([DataSourceRequest] DataSourceRequest request, string importdate)
{
    IEnumerable<ImportHeader> messages = null;

    var msgs = client.GetStringAsync(string.Format("api/importheaders?$filter=RecordSource eq '{0}'", importdate)).Result;
    if (!string.IsNullOrWhiteSpace(msgs))
        messages = JsonConvert.DeserializeObject<IEnumerable<ImportHeader>>(msgs);

    return Json(messages.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

Upvotes: 3

Related Questions