基于单元格值的颜色 dgrid 单元格

Question

我有一个 dgrid，我正在尝试使用格式化程序函数和 css 根据单元格的值设置单元格背景颜色。 dgrid 位于 ID 为 UnMarkedTicketGridDiv

的 div 中

格式化函数：

formatPriority: function (item) {
            return = "<td class='" + item + "'>" + item + "</td>";
        },

css:

#UnMarkedTicketGridDiv td.NORM
{
    background-color:Green;
    color:Green;
}

知道为什么细胞没有变绿吗？我已经验证正在调用格式化程序函数，并且有一个名为 'NORM' 的项目，因此正在定义此 class。我认为 css 选择器是否正确？

这是网格列定义：

grid = new (declare([OnDemandGrid, DijitRegistry]))({
                store: gridStore,
                columns: {
                    ID: "ID",
                    Ticket: "Ticket",
                    Street: "Address",
                    DateRcvdInt: { label: "Date Rcvd", formatter: this.formatDate },
                    WorkDateInt: { label: "Work Date", formatter: this.formatDate },
                    Priority: { label: "Priority", formatter: this.formatPriority },
                    Type: "Type",
                    Company: "Company"
                }

谢谢

Answer 1

通常，最简单的方法是使用 renderCell，这样您就可以直接访问单元格：

Priority: {
    label: "Priority",
    renderCell: function (object, value, cell) {
        cell.className += " " + value;
        return document.createTextNode(value);
    }
}

请注意，renderCell 可以 return 将节点放置在单元格中。我使用 createTextNode 而不是仅仅设置 innerHTML 因为后者可能容易受到来自数据源的 HTML 注入的影响。

基于单元格值的颜色 dgrid 单元格

color dgrid cell based on cell value

javascript

css

dojo

dgrid