在kendo网格中添加具有子属性的新行

时间:2013-06-10 09:51:10

标签: kendo-ui kendo-grid

我正在使用kendo grid [web],我正在使用以下json数据来渲染网格

  

{ “ROWGUID”: “7e6dfa67-47a2-40fb-b3fb-9d21e9cba1c3”, “产品编号”:100, “名称”: “汽车”, “颜色”: “#AAAAA”, “大小”:4“,成本 “:5.26,” 类别 “:{” CATID “:1,” ID “:” f27b7d43-9b57-470e-97a3-023323a5a7ac “ ”姓名“: ”车辆“}, ”类别名称“:空},{” ROWGUID “:” 9cddd550-479c-4df8-883b-50f39e2b4249" , “产品编号” 101 “名称”: “自行车”, “颜色”: “#AAAAB”, “大小”:5, “成本”:6.26, “类别”:{ “CATID”:1, “ID”: “82842c66-223d-4774-A4B4-b748429f5984”, “姓名”: “2Wheeler”}, “类别名称”:空},{ “ROWGUID”:“1a47a67f -ddff-401B-ADEE-b3bb27660e44" , “产品编号”:102, “名称”: “平面”, “颜色”: “#AAAAC”, “大小”:6中, “成本”:7.26, “类别”:{ “CATID”:1, “ID”: “f5bd0e35-9ff4-4a09-8b2b-a1f9c28fb60e”, “名称”: “飞机”}, “类别名称”:空}]

从这个网格中可以看出,这个数据源是一个产品模型,它有一个名为category的内部属性,它又是另一个具有要使用的name属性的对象。

我使用了以下架构

  schema: {
            model: {
                id: "rowguid",
                fields: {
                    rowguid: { editable: false, nullable: true },
                    ProductId: { editable: true, nullable: true },
                    Name: { validation: { required: true} },
                    Color: { type: "string", validation: { required: true, min: 1} },
                    size: { type: "number", validation: { min: 1, required: true} },
                    Cost: { type: "number", validation: { min: 1, required: true }, format: "{0:n2}" }
                    ,CategoryName: {field:"Category.Name", type: "string", validation: { required: true }}
                }
            }
        }

以及以下列声明

  columns: [
            {field:"rowguid",tite:"Unique Id"},
            {field:"ProductId",tite:"Id"},
            {field:"Name",tite:"Name"},
            {field:"Color",tite:"Color", template:colorColumnTemplate},
            {field:"size",tite:"size",type:"number", format: "{0:n2}"},
            {field:"Cost",tite:"Cost",type:"number", format: "{0:n2}"},
            //{field:"CategoryName",title:"Category Name",editor:categoryEditor,template: "#=CategoryName#" },
            {field:"Category.Name",title:"Category Name",editor:categoryEditor},
            { command: { text: "Actions" }, title: "Action", width: "140px" },
            {command: ["edit"], title: "Actions", width: "172px"}
            ],            

这里,网格显示正常并编辑,更新所有工作正常。

问题是当我点击“添加新记录”按钮时,我收到以下错误

Uncaught TypeError: Cannot read property 'Name' of undefined

这是因为当形成剑道模型时,它会尝试将值读取为

javascript对象属性events[idx].call(that, e);是我在kendo网格中添加新行时触发的触发事件中的方法。

我有没有办法使用Category.Name添加新记录。我认为如果我能够在添加新行过程中将模板与网格行相关联或相关联。

请告诉我是否有可能。

1 个答案:

答案 0 :(得分:1)

您需要为复杂字段添加defaultValue,以声明复杂对象的空版本。 kendo尝试设置类别的Name属性,但没有默认的Category对象

fields: [{ 
  field: Category
  defaultValue: { Name: ""}
}]

或MVC助手

  .Name("grid")
  .DataSource(dataSource => dataSource
      .Ajax().Model( model => {
        model.Field( m => m.MyField).DefaultValue(new MyObject())
      })
  ))