Question

我在使用网格内的下拉列表进行内联网格编辑内联时遇到问题，这是我的ScreenShoot

当我单击图标的字段时，该字段将更改为下拉列表像这样 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
    }

Answer 1

我能够使用MVC包装器并按照以下帖子使用它：

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

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

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

没有显示Kendo Grid编辑内联下拉列表

1 个答案: