如何更改字段组 kendo 网格的颜色？

Question

我正在尝试更改网格中我的字段组的颜色，颜色应按值更改，例如：如果字段的值为 'Pedro' 背景颜色为绿色, 如果 'August' 背景颜色是红色...

在下面查看我到目前为止所做的示例以及我想做的事情。

这是我按 UnitsInStock 分组的示例： https://dojo.telerik.com/AJomALET

我想做什么： picture of what I want to do

Answer 1

您可以使用 groupHeaderTemplate 字段来标记每个组。然后使用javascript将类应用于父TD。

  columns: [
        { field: "ProductName", title: "Product Name"},
        { field: "UnitPrice", title: "Unit Price" },
        { field: "UnitsOnOrder", title: "Units On Order"},
        { 
          field: "UnitsInStock", 
          title: "Units In Stock" ,
          groupHeaderTemplate: "<span class='UIS #= value #'>Units In Stock: #= value #</span>"
        }
  ],
  dataBound: function(e) {                       
    $(".UIS.0").closest("td").css("backgroundColor", "red"); 
    $(".UIS.3").closest("td").css("backgroundColor", "#009C00");
    $(".UIS.4").closest("td").css("backgroundColor", "#7F7F7F");
  }

如何更改字段组 kendo 网格的颜色？

How to change the color of a field group kendo Grid?

kendo-ui

grid

telerik-grid