Невозможно установить Kendo UI Grid DataSource

Question

Я делаю дополнение к рабочей сетке пользовательского интерфейса Kendo, чтобы он мог обновляться на основе идентификатора, переданного из текстового поля. Я вызываю мой контроллер из ajax, и все работает как ожидалось, пока я не попытаюсь создать kendo.data.DataSource() для моей сетки внутри успеха ajax. result выглядит так, как ожидалось, но все, что я делаю, чтобы назначить его источнику данных, похоже, не работает. Данные ничего не показывают, и сетка становится пустой.

Модель, ожидаемая сеткой, соответствует той, что находится в моем контроллере. Я просмотрел другие вопросы и кендо, но я не могу понять, что я делаю неправильно ... любая помощь будет оценена.

Ajax:

$.ajax({ 
    type: "POST", 
    url: '@Url.Action("Search")', 
    data: JSON.stringify({ id: id }), 
    dataType: "json", 
    contentType: "application/json; charset=utf-8", 
    success: function (result) { 
     var grid = $("#Grid").data("kendoGrid"); 
     var data = new kendo.data.DataSource(result); 
     grid.dataSource.data(data); 
     grid.refresh(); 
    } 
}); 

Контроллер:

public ActionResult Search([DataSourceRequest]DataSourceRequest request, string id) 
{ 
    IEnumerable<SearchModel> data = GetData(id); 

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

Answer 1

Вы используете метод расширения ToDataSourceResult() на сервере, поэтому вам нужно использовать свойство Data result для присвоения свойства data объекта DataSource, создаваемого на клиенте. Кроме того, вы должны использовать метод setDataSource сетки, а не grid.dataSource.data(). Наконец, вы хотите вызвать метод read() свойства gridSourceSource, а не grid.Refresh().

$.ajax({ 
    type: "POST", 
    url: '@Url.Action("Search")', 
    data: JSON.stringify({ id: id }), 
    dataType: "json", 
    contentType: "application/json; charset=utf-8", 
    success: function (result) { 
     var grid = $("#Grid").data("kendoGrid"); 
     var dataSource = new kendo.data.DataSource({ 
      data: result.Data 
     }); 
     grid.setDataSource(dataSource); 
     grid.dataSource.read(); 
    } 
}); 

Answer 2

Вы создаете DataSource неправильно. Предполагая, что результат вашего вызова AJAX возвращает массив, вы должны затем обернуть его в объект с свойством data, которое содержит массив данных.

$.ajax({ 
    // ... 
    success: function (result) { 
     var grid = $("#Grid").getKendoGrid(); 
     var data = new kendo.data.DataSource({ data: result }); 
     grid.dataSource.data(data); 
     grid.refresh(); 
    } 
}); 

Ниже приведен альтернативный способ создания DataSource и позволяет прохождение в массиве (развернутом), объект DataSource конфигурации, или даже существовавшие ранее DataSource объекта.

var data = kendo.data.DataSource.create(obj); 

Этот подход предпочтительнее b/c, он более гибкий.

Я надеюсь, что это поможет!