不显示带有下拉列表的 Kendo Grid 编辑内联答案

【问题标题】：Kendo Grid edit inline with dropdown list isn't show不显示带有下拉列表的 Kendo Grid 编辑内联
【发布时间】：2016-04-20 07:51:02
【问题描述】：

我在使用网格内的下拉列表进行剑道网格编辑内联时遇到问题，这是我的屏幕截图

screenShoot1->please look field "icon"

当我单击图标的字段时，该字段变为下拉列表像这样 screenshoot2 after i clicked the field icon

，如果我希望字段图标在单击之前是一个下拉列表，我该怎么办？？

这是我的代码：

$("#customers").kendoDropDownList({
        dataTextField: "pis_icon_url",
        dataValueField: "pis_icon_id",
        valueTemplate: '<span class="selected-value" style="background-image: url(\'#:pis_icon_url#\')"></span>',
        template: '<span class="k-state-default" style="background-image: url(\'#:pis_icon_url#\')"\></span>',
        dataSource: {
            transport: {
                read: {
                    dataType: "json",
                    url: "/api/icon-priority"
                }
            },
            schema:{
                data:'list'
            }
        },
        height: 400
    });

var dropdownlist = $("#customers").data("kendoDropDownList");

//在字段中：“pis_icon_id”，请检查“模板”，我已经在标签输入中添加了属性“id='customers'”但它不起作用

$("#grid").kendoGrid({
    dataSource: dataSource,
    pageable: true,
    height: 550,
    columns: [
        { field:"pis_priority_name",title:"Priority Name", width: "180px"  },
        { field: "description", title: "Description", width: "380px" },
        { field: "pis_icon_id", title: "Icon", width: "300px",template:"<input id='customers' data-bind='value:pis_icon_id' style='width:100%;'>",
            editor:categoryDropDownEditor

                // "<div style='width: 100%;'><img src='#:pis_icon_url#' style='width: 22px;height: 22px;'> </div>"
        },
        { field: "pis_priority_color", title: "Color",
            width: "100px",
            editor: function (container, options) {
                $("<input type='color' name='"+options.field+"' data-bind='value:" + options.field + "' />")
                    .appendTo(container)
                    .attr("pis_priority_color", options.field)
                    .kendoColorPicker({
                        buttons: true

                    });
            },
            template: "<span style='display: inline-block; width: 50%; height: 50%; background-color: #= pis_priority_color #'></span>"
        },
        { field: "is_default",
            title: "Default",
            width: "100px",
            template:"<input name='is_default' class='ob-paid' type='checkbox' data-bind='checked: is_default' #= is_default? checked='checked' : '' #/> "
        },
        { field: "active",
            title:"Active",
            template:"<input name='active' class='ob-paid' type='checkbox' data-bind='checked: active' #= active ? checked='checked' : '' #/> "
            ,width: "130px"
        },
        { command: "destroy", title: " ", width: "150px" }],
    editable: {
        update:true
    }

【问题讨论】：

标签： javascript kendo-ui kendo-grid

【解决方案1】：

我能够使用 MVC 包装器并通过关注这篇文章来使其工作：

http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#configuration

由于已知的 Kendo 网格错误，关键是添加了保存事件 - 在我看来，Kendo 文档应该提到这个问题。

我尝试使用 javascript 实现相同的逻辑，但无法正常工作。

【讨论】：