防止 Kendo 详细信息模板中的重复项

Question

我正在尝试在 kendo 中创建分层网格，这就是我所拥有的 far - > https://plnkr.co/edit/tJvRD0CFqZ1gSYEB

 <script>
        function onChange(e) {
            var dataItem = e.sender.dataItem();
        };
        var data = [
 
        ]
        index = data.length + 1;

           $("#grid").kendoGrid({
            dataSource: {
                transport: {
                    read: function (o) {
                        o.success(data);
                    },
                    update: function (o) {
                        o.success();
                    },
                    destroy: function (o) {  
                        var d = data.filter(data => data.id == o.data.id);
                        var removeIndex = data.map(data => data.id).indexOf(o.data.id);
                        if (removeIndex >= 0) {
                            data.splice(removeIndex, 1);
                        }
                        o.success();
                    },
                    create: function (o) {
                        var record = o.data;
                        record.id = index;
                        index++;
                        data.push(o.data);
                        Object.assign(o.data, { courses: [] })
                        o.success(record);
                    }
                },
                schema: {
                    model: {
                        id: "id",
                        fields: {
                            id: { type: "number", editable: false },
                            name: {
                                type: "string",
                                validation: {
                                    required: true,
                                    duplicate: function (input) {
                                        debugger;
                                        if (input.is("[name='name']") && input.val() != "") {
                                            var name = input.val();
                                            var grid = $("#grid").data('kendoGrid');
                                            var view = grid.dataSource.view();
                                            var name_edit = grid.editable.options.model.name;
                                            var valid = true;
                                            for (var i = 0; i < view.length; i++) {
                                                if ((name == view[i].name && (name != name_edit))) {
                                                    valid = false;
                                                    input.attr("data-duplicate-msg", "Duplicates not allowed.");
                                                    break;
                                                }
                                            }
                                            return valid;
                                        }
                                        
    
                                        return true;
                                    },
                                },},
                            isActive: { type: "boolean" },
                            description: { type: "string" }
                        }
                    }
                }
            },
            editable: "popup",
            toolbar: [{ name: "create", text: "Add Sub Group" }],
            columns: [
                "name",
                "isActive",
                "description",
                { command: ["edit", "destroy"] }
            ],
            detailInit: detailInit
        });
        function detailInit(e) {
            $("<div/>").appendTo(e.detailCell).kendoGrid({
                dataSource: {
                    transport: {
                        read: function (o) {
                            var subdata = [
                            ]
                            o.success(e.data.courses);
                        },
                        update: function (o) {
                            var parentid = data.filter(x => x.id == e.data.id)[0];
                            var parentIndex = data.map(function (img) { return img.id; }).indexOf(parentid.id);
                            var childIndex = data[parentIndex].courses.map(function (img) { return img.id; }).indexOf(o.data.id);
                            data[parentIndex].courses[childIndex].name = o.data.name;
                            data[parentIndex].courses[childIndex].coursetext= o.data.coursetext;
                            data[parentIndex].courses[childIndex].courseteacher= o.data.courseteacher;
                            o.success();
                        },
                        destroy: function (o) {
                            debugger;
                            var parentid = data.filter(x => x.id == e.data.id)[0];
                            var parentIndex = data.map(function (img) { return img.id; }).indexOf(parentid.id);
                            var childIndex = data[parentIndex].courses.map(function (img) { return img.id; }).indexOf(o.data.id);
                            if (childIndex >= 0) {
                                data[parentIndex].courses.splice(childIndex, 1);
                            }
                            o.success();
                        },
                        create: function (o) {
                            var record = o.data;
                            record.id = index;
                            index++;
                            var dataobj = data.filter(x => x.id == e.data.id)[0];
                            dataobj.courses.push(record);
                            o.success(record);
                        }
                    },
                    schema: {
                        model: {
                            id: "id",
                            fields: {
                                id: { type: "number", editable: false },
                                name: {
                                    type: "string",
                                    validation: {
                                        required: true,
                                        duplicate: function (input) {
                                            if (input.is("[name='name']") && input.val() != "") {
                                                var name = input.val();
                                                var grid = $("#grid").data('kendoGrid');
                                                var view = grid.dataSource.view();
                                                var parentid = grid._data.filter(x => x.name == e.data.name)[0];
                                                var parentIndex = grid._data.map(function (img) { return img.id; }).indexOf(parentid.id);
                                                var view = grid._data[parentIndex].courses;
                                                var valid = true;
                                                for (var i = 1; i < view.length; i++) {
                                                    if ((name == view[i].name)) {
                                                        valid = false;
                                                        input.attr("data-duplicate-msg", "Duplicates not allowed.");
                                                        break;
                                                    }
                                                }
                                                return valid;
                                            }
    
                                            return true;
                                        },
                                    },
                                },
                                coursename: { type: "string" },
                                courseteacher: { type: "string" }
                            }
                        }
                    }
                },
                editable: "popup",
                toolbar: [{ name: "create", text: "Add Courses" }],
                columns: [
                    "name",
                    "coursename",
                    { field: "courseteacher", title: "courseteacher"},
                    { command: ["edit", "destroy"] }
                ]
            });
        }
    </script>

我想要实现的是，我想防止添加重复的“名称”。我已将验证放在父网格中，并且工作正常。现在我想在子网格中进行类似的验证。我无法在子网格中获取当前可编辑的行。我是通过“var name_edit = grid.editable.options.model.name;”获取的在父网格中，我需要一个替代子网格。

如果有任何帮助，我将不胜感激，因为这对我的项目 TIA 至关重要。

Answer 1

我在外部为子网格创建了验证函数，我首先将实例保存在编辑事件中，然后将输入和子网格实例传递给它并且它起作用了。

edit:function(e){
            childGrid = e.sender;
          },

// ...

duplicate: function (input) {
                        return validateDuplicate(input, childGrid);
                      }