为什么 Kendo 的 dataSource.transport.update 方法不向服务器发送数据？答案

【问题标题】：Why Kendo dataSouce.transport.update method do not send data to the server?为什么 Kendo 的 dataSource.transport.update 方法不向服务器发送数据？
【发布时间】：2016-01-04 13:42:25
【问题描述】：

我有一个 Kendo UI TreeList，其中每一行都显示了一个复选框。如果用户单击复选框，则请求将发送到服务器并保存数据。不幸的是，我做错了，因为：

更新方法不向服务器发送数据
并且不会自动调用同步方法

我做错了什么？

我认为问题在于我如何设置哪个项目发生了变化。如您所见，我遍历了来自dataSource.data() 的数据集，并且更新了 item.checked 和 item.dirty 属性。如果我对documentation 的理解正确，那么这些更改应该会触发同步方法。它不会触发同步方法，这就是我在方法中调用它的原因。

我的另一个问题是应该发送到服务器的数据结构。它是基于模式的，对吧？因此，一旦我可以实现请求将对象发送到服务器，我应该创建一个类似的 C# POCO 作为模型，并且我可以在 webapi 控制器中读取数据。

在文档中有一个saveRow() 方法，但我无法将该代码转换为角度。在这种情况下有人可以帮助我吗？

//this row is my problem
var treeList = $("#treeList").data("kendoTreeList");

var dataSource = new kendo.data.TreeListDataSource({
                transport: {
                    read: {
                        url: configurationService.goNoGoWebApiRootUrl + 'AreaPathDependencies/Get/ChildrenMarked/' + selectedAreaPathIdFromModalService,
                        dataType: "json",
                        type: "get"
                    },
                    update:
                        {
                            url: configurationService.goNoGoWebApiRootUrl + 'AreaPathDependencies/Update/AreaPathDependencies',
                            dataType: "json",
                            type: "post"
                        },
                    parameterMap: function (options, operation) {
                        if (operation !== "read" && options.models) {
                            return { models: kendo.stringify(options.models) };
                        }
                    }
                },
                schema: {
                    model: {
                        id: "id",
                        parentId: "parentId",
                        fields: {
                            Id: { type: "number", editable: false, nullable: true },
                            ParentId: { type: "number", editable: false, nullable: true },
                            Name: { type: "string", editable: false, nullable: true },
                            Checked: { type: "boolean", editable: true, nullable: false }
                        }
                    }
                }
            });

            vm.treeListOptions = {
                dataSource: dataSource,
                sortable: false,
                editable: false,
                columns: [
                    {
                        field: "checked",
                        title: "Selected",
                        template: checkBoxTemplate,
                        width: 32
                    },
                    { field: "name", title: "Area Path", width: "200px", expandable: true },
                    { field: "fullPath", title: "FullPath", width: "500px" },
                ],
                save: onSave,
                change: onChange,
                sync: sync,
                autoSync: true,
            };

        }

        function checkboxOnclick(selectedId) {
            console.log('checkboxOnclick', selectedId);
            var data = vm.treeListOptions.dataSource.data();
            for (var i = 0; i < data.length; i++) {

                if (selectedId == data[i].id) {
                    data[i].set("checked", true);
                    //data[i].dirty = true;
                }
            }

            vm.treeListOptions.dataSource.sync();

            //console.log('flush', vm.treeListOptions.dataSource.data());
        }

【问题讨论】：

请尝试将 batch: true (batch docs) 设置到您的数据源中（与传输和架构处于同一级别）。
哇！有用！但是，我需要调用同步方法。问题仍然存在，我是否需要调用同步方法或者数据模型中的更改应该由小部件自动持久化。为什么需要 bacth:true ？是缺陷吗？请写一个答案，我会接受的。

标签： javascript angularjs kendo-ui kendo-treelist

【解决方案1】：

batch: true 必须设置为使 parameterMap 工作，因为模型参数仅在启用批处理选项时可用。 (parameterMap docs)

关于第二个问题 - 我不太确定，但正如 sync 文档中所述，

如果出现以下情况，同步方法将请求远程服务：

transport.create 选项已设置且数据源包含新数据项

transport.destroy 选项已设置，数据项已从数据源中删除

transport.update 选项已设置且数据源包含更新的数据项

我对此的理解 - 要让 sync 方法正常工作，您需要返回更新的记录。请检查您的更新/删除服务器方法是否返回。

【讨论】：