如何将Kendo UI Grid绑定到Web API Controller？

Question

我是一名有益的助手，可以帮您进行文本翻译。以下是需要翻译的内容：

我在将Web API控制器中的数据绑定到Kendo UI网格时遇到了问题。不幸的是，我没有找到任何相关的示例。

以下是API控制器代码：

public class FruitController : ApiController
{
    public class Fruit
    {
        public string Name { get; set; }
        public string Color { get; set; }
    }

    public IEnumerable<Fruit> GetFruits()
    {
        List<Fruit> list = new List<Fruit>();

        Fruit f = new Fruit();
        f.Name = "Apple";
        f.Color = "Red";

        list.Add(f);

        f = new Fruit();
        f.Name = "Kiwi";
        f.Color = "Green";

        list.Add(f);

        return list;
    }
}

在我的 .cshtml 文件中，我有以下代码：

 @model IEnumerable<FruitController.Fruit>

    @(Html.Kendo().Grid(Model)    
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.Name);
            columns.Bound(p => p.Color);
        })
        .Groupable()
        .Pageable()
        .Sortable()
        .Scrollable()
        .Filterable()
        .DataSource(dataSource => dataSource
            .Ajax()
            .Read(read => read.Action("GetFruits", "api/Fruit").Type(HttpVerbs.Get)

            )
        )
    )

当我运行此代码时，从控制器获得了一个成功的JSON响应：

[{"Name": "苹果", "Color": "红色"}, {"Name": "奇异果", "Color": "绿色"}]

但是表格中没有数据。我是否漏掉了什么明显的问题？我一直无法解决这个问题！

谢谢！

- Dave

Answer 1

看看例子，它期望一个 DataSourceResult。在您的控制器中包含一个类似这样的方法，然后它就能正常工作了。

我正在考虑使用 postsharp 创建一个方面，该方面将在控制器类中引入 Kendo 所需的 create/update/delete 方法。

using Kendo.Mvc.Extensions;

  public DataSourceResult Read([DataSourceRequest] DataSourceRequest request)
        {
            return this.Get().ToDataSourceResult(request);
        }

我认为很奇怪的是，Kendo没有为API控制器类提供这个属性/方面，但也许我漏掉了什么..

- user1496353

---

谢谢，将我的APIController方法的返回类型更改为DataSourceResult可以使网格显示数据。但是，如果我尝试使用AutoComplete控件，它现在会失败。因此，这个Grid控件不能与标准的APIController一起使用，这是正确的吗？必须将所有APIController结果设置为DataSourceResult类型似乎是错误的，因为其他客户端可能会使用它们。 - Dave

Answer 2

我也曾经遇到过在API控制器中使用Kendo的困难。对我来说，切换从using Kendo.Mvc.Extensions 到 using Kendo.DynamicLinq是有效的。

在我的Kendo数据源中，我删除了神秘的行type: aspnetmvc-ajax和parameterMap。

- Elaine Lin