Question

我正在使用编辑器模板通过弹出窗口显示Kendo网格的下拉列表。填充网格的初始查询使用/?$expand=ContactType，其中ContactType是查找值，Contact是父记录。这很好，网格显示正确的数据和相关的ContactType。单击edit也可以，因为我已经定义了一个编辑器模板来显示下拉列表，并且选中了下拉列表中的正确值。

但是我的问题是添加新记录。当我点击add时，我会

ContactType未定义。

这是有道理的，因为我在使用expand时没有在datagrid的datsource模式中明确定义ContactType。我可以将ContactType添加到模型定义中，没有问题，并且错误消失了 - 但是当发送更新时ContactType是一个空字符串而没有获取实际选定的值。 ContactType是Contact的相关实体，根据我的理解，您无法定义具有相关实体的模型，它们具有HierarchicalDataSource但仅适用于树视图。

因此，在网格的弹出编辑器中给出一个下拉列表，如何让Add new发送所选的下拉值？

以下是一些代码，TIA提供任何帮助

<script id="popup_editor" type="text/x-kendo-template">
    <div class="k-edit-label">
    <label for="firstName">First Name</label>
    </div>
    <input type="text" name="firstName"  data-bind="value:firstName" />

    <div class="k-edit-label">
    <label for="middleName">Middle Name</label>
    </div>
    <input type="text" name="middleName"  data-bind="value:middleName" />

    <div class="k-edit-label">
    <label for="lastName">Last Name</label>
    </div>
    <input type="text" name="lastName"  data-bind="value:lastName" />

    <input name="ContactType" data-source="myDropdownDS" data-text-field="name"
    data-value-field="__KEY" data-bind="value:ContactType.__KEY" data-role="dropdownlist" />
</script>

<script>

    //Local
    var crudServiceBaseUrl = "http://127.0.0.1:8081/cors/";
    var myGridDS = new kendo.data.DataSource({
        type : "json",
        transport : {
            read : {
                url : crudServiceBaseUrl + "Contact" + "/?$expand=ContactType",
                dataType : "json",
                type : "GET",
                complete : function(jqXHR, textStatus) {
                    textStatus = "read";
                }
            },
            update : {
                url : crudServiceBaseUrl + "Contact" + "/?$method=update",
                dataType : "json",
                type : "POST",
                complete : function(jqXHR, textStatus) {
                    textStatus = "update";
                }
            },
            destroy : {
                url : crudServiceBaseUrl + "Contact" + "/?$method=delete",
                type : "GET",
                complete : function(jqXHR, textStatus) {
                    textStatus = "destroy";
                }
            },
            create : {
                url : crudServiceBaseUrl + "Contact" + "/?$method=update",
                dataType : "json",
                type : "POST",
                complete : function(jqXHR, textStatus) {
                    textStatus = "create";
                }
            },
            errors : function(response) { 
                var errorData = $.parseJSON(e.responseText);
                alert(errorData.errorMessage);
                //$("#loading").innerHtml = "error";
            },
            parameterMap : function(options, operation) {
                if (operation == "create") { 
                    return JSON.stringify({
                        "__ENTITIES" : options.models
                    });
                } else if (operation == "update") { 
                    var isEdit = true
                    var myParentEntity = "Contact"
                    var myData = options.models[0];
                    //uri gets added after first edit from Wakanda response, not needed and causes update to fail so delete
                    // delete myData.uri;
                    //

                    configureDataRowRelations(myParentEntity, myData, isEdit)
                    return JSON.stringify({
                        "__ENTITIES" : options.models
                    });
                }

            }
        },
        serverPaging : true,
        serverSorting : true,
        serverFiltering : true,
        batch : true,
        pageSize : 30,
        schema : {
            model : {
                id : "__KEY",
                fields : {
                    __KEY : {
                        type : "string"
                    },
                    __STAMP : {
                        type : "number"
                    },
                    ID : {
                        editable : false,
                        nullable : true
                    },
                    firstName : {
                        type : "string",
                        validation : {
                            required : true
                        }
                    },
                    middleName : {
                        type : "string"
                    },
                    lastName : {
                        type : "string",
                        validation : {
                            required : true
                        }
                    },
                    ContactType : {}
                }
            },
            data : "__ENTITIES"
        }
    });

    var myDropdownDS = new kendo.data.DataSource({
        type : "json",
        transport : {
            read : {
                url : crudServiceBaseUrl + "ContactType",
                dataType : "json",
                type : "GET",
            }
        },
        batch : true,
        pageSize : 30,
        schema : {
            model : {
                id : "__KEY",
                fields : {
                    __KEY : {
                        type : "string"
                    },
                    __STAMP : {
                        type : "number"
                    },
                    ID : {
                        editable : false,
                        nullable : true
                    },
                    name : {
                        type : "string",
                        validation : {
                            required : true
                        }
                    }
                }
            },
            data : "__ENTITIES"
        }
    });



    $('#PopupContactContactTypeGrid').kendoGrid({
        selectable : "row",
        filterable : true,
        pageable : true,
        sortable : true,
        dataSource : myGridDS,
        toolbar : ["create"],
        columns : [{
            field : "ID"
        }, {
            field : "firstName",
            title : "First Name"
        }, {
            field : "middleName",
            title : "Middle Name"
        }, {
            field : "lastName",
            title : "Last Name"
        }, {
            field : "ContactType.name",
            title : "Contact Type"
        }, {
            command : ["edit", "destroy"],
            title : "&nbsp;",
            width : "210px"
        }],
        editable : {
            mode : "popup",
            template : $("#popup_editor").html()
        },

    });

Answer 1

如果在您的情况下未将值填充到输入中，则可能是由于使用与字段名称不同的名称引起的

所以我改变了data-bind="value:ContactType.__KEY" 到data-bind="value:ContactType"

由于缺乏通常不是Telerik问题的优秀文档和示例，这需要很长时间才能解决。

KendoUI Grid使用未在架构中定义的下拉列表添加新记录弹出窗口

1 个答案: