5

我在我的应用程序中使用 JQGrid。

在这里，我想根据列中的值更改 JqGrid 行的颜色。

我可以更改列的颜色，但不能更改行的背景颜色。

这是我用来更改行颜色的代码...

loadComplete: function (data) {
    //RETRIEVE COLUMN INDEX : ISPRINTED
    var isPrintColIndex = getGridColumnIndex(jQuery("#list10_d"), 'isPrinted');

    //CHANGE COLOR OF PRINTED ARTICLES
    //NOTE : JSON FORMATs ARE DIFFERENT SO ...HERE WE ARE ADDING CONDITION
    if (data != null && data.rows != null) {
        for (var index = 0; index < data.rows.length; index++) {

            if (typeof (data.rows[index].id) === 'undefined') {
                //LOAD BY JQGRID API ITSELF
                if (data.rows[index].isPrinted == 'NO') {
                    if (data.rows[index].isPrinted == 'NO') {
                        jQuery("#list10_d").jqGrid(
                            'setCell', data.rows[index]._id_, "articleid",
                            "", {
                            'background-color': 'red'
                        });
                    }
                }
            } else {
                ///FOR FIRST LOAD : LOAD BY JSON CALL
                if (data.rows[index].cell[isPrintColIndex] == 'NO') {
                    jQuery("#list10_d").jqGrid(
                        'setCell', data.rows[index].id, "articleid", "", { 'background-color': 'red' });
                }
            }
        }
    }
}

谁能建议我更改上面的代码所以我可以更改行的背景颜色？

4

3 回答 3

6

行的颜色（背景颜色或文本颜色）可以通过在选定元素（行）上分配附加style或属性来定义。jqGrid允许在填充网格主体期间执行此操作。因此，使用将使您获得最佳性能。您应该使用来查看性能改进。class<tr>rowattrrowattrgridview: true

答案提供了您问题的解决方案。

这里描述的替代方法很慢，应该只在没有rowattr实现特性的旧版本的 jqGrid 上使用。要了解为什么使用方式rowattr更快，我建议您阅读答案。

于 2013-01-21T13:12:16.250 回答
1

在 - 的里面

loadComplete: function (){

    var rowIds = $(grid).jqGrid('getDataIDs');
    for (i = 1; i <= rowIds.length; i++) {//iterate over each row
        rowData = $(grid).jqGrid('getRowData', i);
        //set background style if ColumnValue == true
        if (rowData['ColumnValue'] == 'true') {
            $(grid).jqGrid('setRowData', i, false, "CSSRowSTyleToApply");
        } //if
    } //for
}//loadComplete

这应该做你正在寻找的。如果您想根据行内的值为行着色，您可以只取出该值，因为您已经拥有当前所在的行信息。

于 2013-01-21T12:21:23.933 回答
0

上面的解决方案非常接近，但是需要一些非常重要的更改，请使用下面的解决方案，希望您会喜欢！

loadComplete: function () {
  var rowIds = $('#YourGridId').jqGrid('getDataIDs');
       for (i = 0; i < rowIds.length; i++) {//iterate over each row
       rowData = $('#YourGridId').jqGrid('getRowData', rowIds[i]);
       //set background style if ColValue === true\
       if (rowData['ColName'] === "ColValue") {
         $('#YourGridId').jqGrid('setRowData', rowIds[i], false, "CSSClass");
       } //if
  } //for
}//loadComplete

于 2015-02-05T07:24:18.323 回答