剑道网格:如何添加颜色选择器

Kendo Grid: how add colorpicker

本文关键字:添加 颜色 选择器 何添加 网格      更新时间:2023-09-26

我有一个剑道网格与内联编辑。现在,在一个列中,我想添加一个剑道选色器。我怎么能添加它,并显示所选的颜色时,行不在编辑模式?

谁能给我任何例子与颜色选择器内的剑道网格?

谢谢

正如@dfsq所说,您必须使用单元格模板来显示颜色。此外,您需要为ColorPicker定义一个columns.editor

模板的代码是一个生成div的函数,其背景颜色是来自网格的color值:

template:  function(dataItem) {
    return "<div style='background-color: " + dataItem.Color + ";'>&nbsp;</div>";
},

对于editor,您应该将函数定义为:

editor : function (container, options) {
    // create an input element
    var input = $("<input/>");
    // set its name to the field to which the column is bound ('name' in this case)
    input.attr("name", options.field);
    // append it to the container
    input.appendTo(container);
    // initialize a Kendo UI ColorPicker
    input.kendoColorPicker({
        value: options.model.Color,
        buttons: false
    });
}

您可以在这里看到一个示例:http://jsfiddle.net/OnaBai/6XJV6/