Kendo UI网格(内联编辑)更新和取消不起作用

时间:2014-02-27 03:06:53

标签: kendo-ui kendo-grid

我通过javascript创建数据网格。当我第一次在任何行上单击编辑按钮并单击更新按钮时。第一行中的值为null然后我编辑其他行我无法更新或取消,两个按钮都不起作用。 当我刷新然后单击编辑,然后单击取消该行已删除我不知道为什么? 发生了什么?怎么修?

数据

var detail = new Array();

for (var i = 1; i < 6; i++) {
     detail.push({
        Score: i,
        Condition: 0,
        ValueStart: 0,
        ValueEnd: 0,
      });
}

网格

for (var i = 0; i < 3; i++) {
$("#GridScoreRangeContent").append("<div id='scoreRangeGrid_"+i+"'></div>");



$("#scoreRangeGrid_"+i).kendoGrid({
     dataSource: {
         data: detail,
         batch: true,
         schema: {
            model: {
              fields: {
                 Score: { editable: false },
                 Condition: { defaultValue: { Value: 1, Text: "Less than" }, validation: { required: true } },
                 ValueStart: { type: "number", validation: { required: true, min: 1 } },
                 ValueEnd: { type: "number", validation: { required: true, min: 1 } },
               }
            }
         }
      },
columns: [{ field: "Score", title: "Score" }},
         { field: "Condition", title: "Condition", editor: ScoreRangeDropDownList, template: "#=Condition#" },
         { field: "ValueStart", title: "Start" },
         { field: "ValueEnd", title: "End" },
         { command: ["edit", "destroy"], title: "&nbsp;", width: "180px" }
        ],
        editable: "inline"
 });
}

加载下拉列表

function ScoreRangeDropDownList(container, options) {
    $.ajax({
        url: GetUrl("Admin/Appr/LoadDropdownlist"),
        type: 'post',
        dataType: 'json',
        contentType: 'application/json',
        traditional: true,
        cache: false,
        success: function (data) {
            $('<input required data-text-field="Text" data-value-field="Value" data-bind="value:' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
                    autoBind: false,
                    dataSource: data,
                    dataTextField: "Text",
                    dataValueField: "Value",
                });
        }
    });
}                                    

2 个答案:

答案 0 :(得分:3)

Kendo似乎在保存/更新时依赖于模型ID。所以在你的dataSource中,你必须指定一个id:

model: {
    id: "Id",
    fields: {
        Id: { type: "number" },
        Score: { editable: false },
        Condition: { defaultValue: { Value: 1, Text: "Less than" }, validation: { required: true } },
        ValueStart: { type: "number", validation: { required: true, min: 1 } },
        ValueEnd: { type: "number", validation: { required: true, min: 1 } },
  }
}

答案 1 :(得分:0)

dmathisen建议的内容绝对重要,但另外重要的是&lt; input /&gt;您创建的name属性等于列的名称。您可以再次使用options.field的值,如Kendo Demos页面示例中的代码:

// create an input element
var input = $("<input/>");
// set its 'name' to the field to which the column is bound
input.attr("name", options.field);
// append it to the container
input.appendTo(container);
// initialize a Kendo UI Widget
input.kendoDropDownList({
.
.