如何使用嵌套模型填充Kendo UI网格?

时间:2016-04-20 20:16:52

标签: javascript asp.net-mvc kendo-ui nested

我正在尝试将我的Kendo UI网格与嵌套模型绑定,例如具有嵌套模型类别的Products。我已根据文档提供了所有内容,但我无法发现我的代码出了什么问题。

       schema: {
            data: "data",
            total: "Total",
            model: { // define the model of the data source. Required for   validation and property types.
                id: "ProductID",
                fields: {
                    ProductID: { editable: false, nullable: true },
                    ProductName: { validation: { required: true } },
                    UnitPrice: { type: "number", validation: { required: true, min: 1 } },
                    Discontinued: { type: "boolean" },
                    UnitsInStock: { type: "number", validation: { min: 0, required: true } },
                    CategoryName: { from: "Category.CategoryName", validate: { required: true } }
                }
            }
        },

并在网格的列中使用此模型

 columns: [
        "ProductName",
        { field: "UnitPrice", format: "{0:c}", width: "150px" },
        { field: "UnitsInStock", width: "150px" },
        { field: "Discontinued", width: "100px" },
        { field: "QuantityPerUnit", width: "100px" },
        { field: "CategoryName", title: "Category", width: "100px" },
        { command: "destroy", title: "Delete", width: "110px" },

以下是我从服务器返回的模型。

     var resl = productService.GetProducts(take, skip, ref Total);
        var data = resl.ToList();

        // Return as JSON - the Kendo Grid will use the response
        return Json(new { Total = Total, data = data });

现在所有列都成功绑定了网格,而不是类别名称列。我错过了什么或做错了吗?

已更新 - 以下是我的服务器产品视图模型

   public class ProductViewModel
    {
    public int ProductID { get; set; }
    public string ProductName { get; set; }
    public decimal UnitPrice { get; set; }
    public string QuantityPerUnit { get; set; }
    public Int32 UnitsInStock { get; set; }
    public int? UnitsOnOrder { get; set; }
    public int? ReorderLevel { get; set; }
    public bool Discontinued { get; set; }
    public int? SupplierID { get; set; }

    public int? CategoryID { get; set; }

    public CategoryViewModel Category { get; set; }

这就是我在客户端接收数据的方式。

enter image description here

2 个答案:

答案 0 :(得分:0)

我现在无法尝试这一点,但这里有一个想法:您的控制器响应在顶层包含一个名为CategoryName的字段,而在您的模型中,您正在定义另一个具有相同名称的字段...即使您告诉你要将它映射到Category.CategoryName,我想它可能会从你的响应中取出顶级的CategoryName(未定义)。

尝试在模型中为CategoryName使用不同的名称....这个名称与您的响应中的任何名称都不匹配,看看是否这样做。

回复结果。祝你好运

答案 1 :(得分:0)

我花了两天的时间成功解决了这个问题。问题是我在Knedo Grid中明确定义了CategoryName,根据不需要做的文档,我只是将其删除并在模式模型字段中添加以下行。

{ field: "Category.CategoryName",  width: "100px" },

通过这种方式,嵌套模型的属性直接与列绑定。我必须说剑道的文件很糟糕。