Kendo UI 颜色选择器未显示选择颜色的对话框

Question

我试图在单击 Kendo 网格的单元格时显示 Kendo 拾色器。

我的实际代码要复杂得多，而且大部分是在执行期间生成的。但是，这是我的编辑器代码，用于编辑 Kendo 网格的特定列。

editor: function(container, options){ 
    var color = document.createElement('input');
    color.setAttribute('type', 'color');
    color.setAttribute('id', 'myColorField');
    container.show();
    $('#myColorField').appendTo(container).kendoColorPicker(
        {
            buttons: true
         }
    );
    }

我没有收到任何错误，但是，当我单击单元格进行编辑时，没有颜色 selection window 出现。（只有文本在单击单元格时消失。）我对 Kendo UI 很陌生。有人可以帮忙吗？

谢谢！

更新：

我将代码更改如下：

editor: function(container, options){ 
    var color = document.createElement('input');
    color.setAttribute('type', 'color');
    color.setAttribute('class', 'myColorField');
    container.show();
    $(this).find('.myColorField').appendTo(container).kendoColorPicker(
        {
            buttons: true
         }
    );
    }

仍然没有运气！

更新：替代方法，但仍然无效！

editor: function(container, options){ 
  $("< input type = 'color' data-bind = 'value:" + prop.Name + "' /> " ).appendTo(container).kendoColorPicker({buttons: true});
}

更新：部分工作代码！

sb.Append(", editor: function(container, options){ " +
                                          "console.log(container);" +
                                           "$(\"< input name = '\"+options.field+\"' /> \" )" +
                                               ".appendTo(container)" +
                                               ".kendoColorPicker(" +
                                               "{" +
                                                   "buttons: true, " +
                                                   "value: options.model." + prop.Name+ "," +
                                                   "select: function(e) {" +
                                                        "options.model." + prop.Name + " = e.value" +
                                                   "}" +
                                               "}" +
                                           ");" +
                                       "}"
                                    );

我现在可以 select 从颜色选择器中选择颜色并将其设置为我想要的字段。但是，当我试图打开这个颜色选择器时，它看起来很奇怪，它显示了来自上面代码的标签的数据。我尝试了很多东西，但是，没有任何效果！

更新：有一个意外 space。正确的代码是这样的：

"$(\"<input name = '\"+options.field+\"' /> \" )"

而不是这个：

"$(\"< input name = '\"+options.field+\"' /> \" )"

Answer 1

这是一个简单的 dojo，向您展示了将颜色选择器添加到网格中。 https://dojo.telerik.com/aRUsUJOw

更新道场：这一个显示了被选择的新颜色风格化的颜色，而不仅仅是十六进制颜色代码。 https://dojo.telerik.com/aRUsUJOw/4

Kendo UI 颜色选择器未显示选择颜色的对话框

Kendo UI color picker not showing the dialog to choose color

javascript

kendo-ui

kendo-grid