Question

我使用kendoUi通过REST API与我的后端服务器连接。目前的目标是使bool字段可以在网格中进行更改。我是按照以下方式做的。

    function onLoad() {
var Task = kendo.data.Model.define({
    id : "id",
    fields : {
        "id" : { type: "number"},
        "date" : { type: "date"}, 
        "done" : { type: "boolean"},
        "class" : { type: "string"},
        "title" : { type : "string" }
    }
});

var dataSource = new kendo.data.DataSource({
    type: "jsonp",
//    autoSync: true,
    transport: {
       read: "http://localhost:9090/todo-backend/tasks",
       update: {
            type: "PUT",
            contentType: "application/json"
        },
        parameterMap: function(data, operation) {
            if (operation === "update") {
                return JSON.stringify(data);
            }
            return data;
        }
    },
    schema: {
        model: Task
    }
});

var selectedTask;

$("#grid").kendoGrid({ 
     dataSource: dataSource,
     selectable: true,
     columns: [{ field: "done", title: "Done" , template: "<input type='checkbox' class='cb_done' data-bind='checked:done', #= done ? checked='checked' : '' #/>" },
          { field: "title", title: "Task"}],
     change: function() {
         var title;
         this.select().each(function() {
             var dataRow = grid.dataItem($(this));
             title = dataRow.title;
             selectedTask = dataRow;
         })

         this.dataSource.transport.options.update.url= "http://localhost:9090/todo-          backend/tasks/" + selectedTask.id;

         $("#change-title").val(title);
}
});

var grid = $("#grid").data("kendoGrid");

grid.tbody.on("change", ".cb_done", function (e) {
    var row = $(e.target).closest("tr");
    var item = grid.dataItem(row);
    item.set("done", $(e.target).is(":checked"));
    dataSource.sync();
});

$("#change-task").click(function() {
    var val = $("#change-title").val();
    selectedTask.set("title", val);
    dataSource.sync();
    dataSource.read();
})

}

window.onload=onLoad;

为了实现这种方法，我读到：checkbox binding，dataSource.columns，kendo.data.Model和this，this，this

当我尝试同步dataSource（）时，我的复选框（cb）会重置为无效状态。只有在刷新页面后，我才能看到实际的任务状态。看起来cb在dataSource.columns的声明阶段使用了初始值。

提前致谢！

Answer 1

Hm .. dataSource.sync（）附加到“tbody.on change”例程。这解决了这个问题。现在一切都好。 0_o。编辑代码片段。而且还不知道这种奇怪行为的原因是什么。

为什么我的复选框在dataSource同步但传入数据被正确修改后重置？

1 个答案: