2

我有 21 行的网格。我的要求是设置一些行的背景颜色为浅绿色（如 1、5、13 行）这是否可以实现。

$("#gridSellIn")
     .kendoGrid({
         width: 1500,
         dataSource: data.d,
         resizable: true,
         selectable: true,                                
         rowTemplate: kendo.template($("#SellInrowTemplate").html()),
                            height: 500,
                            columns: [
                                            { title: 'RevProduct Name', field: 'ProductName', width: '22%', sortable: true },
                                            { title: 'Actuals', field: 'Actual', width: '8%', sortable: true },

                                      ]
                        });
4

5 回答 5

12

你可以试试这个条件方法

var grid = $("#gridSellIn").data("kendoGrid");
var data = grid.dataSource.data();
$.each(data, function (i, row) {
  if (row.ProductName == 'Apples')
     $('tr[data-uid="' + row.uid + '"] ').css("background-color", "green");
}
于 2013-07-17T20:57:46.823 回答
6

您可以使用 jQuery 设置任何 HTML 元素的任何 CSS 属性。这包括表格行和背景颜色。这里有一些让你开始的东西：

$("#gridSellIn tr").css("background-color", "red");

有关更多信息，请参阅 jQuery 文档：

于 2012-12-06T13:24:27.100 回答
3

在数据绑定事件中，您可以：

var rows = e.sender.tbody.children();
 
for (var j = 0; j < rows.length; j++) {
    var row = $(rows[j]);
    var dataItem = e.sender.dataItem(row);
 
    if (dataItem.get("PropertyName") != 0) {
        row.addClass("someCssColorClass");
    }
}

于 2015-12-09T20:04:12.577 回答
1 
    var grid = $("#Grid").data("kendoGrid");
    var data = grid.dataSource.data();
    // the section below is using JQuery each function to loop
    // over the grid data then checking the row index if its an odd or even number
    //by finding the modulus of the number.
    // In this case i'm checking for odd number

    $.each(data, (i, row) => {        
        if (i % 2) {
            $('tr[data-uid="' + row.uid + '"]').css("background-color","rgb(247, 244, 244)");
        }
    });
于 2015-08-25T00:52:30.493 回答
1

我注意到您正在使用行模板：

rowTemplate: kendo.template($("#SellInrowTemplate").html())

如果数据集中有一个值绑定到确定需要突出显示的行的网格，则可以在模板中设置绑定颜色：

# if (data.columnvalue === condition) { #
<tr class="highlight">
#} else {#
<tr>
#} #
于 2015-12-11T15:33:50.287 回答