jquery - jqGrid : How to add CSS class for a row with specific criteria

Question

请考虑这种情况:

我有一个数组，我想使用 jqGrid 显示它:

var arr = [
        { Id: 1, Name: "J1" , Age: 40},
        { Id: 2, Name: "J2" , Age: 50},
        { Id: 3, Name: "J3" , Age: 60},
        { Id: 4, Name: "J4" , Age: 70},
        { Id: 5, Name: "J5" , Age: 80},
    ];

我想为我的网格使用 Bootstrap 样式，并且我想根据某些行条件添加 CSS 类。例如:

Criteria          CSS class
----------------------------
Age >= 80          table-danger
70 <= Age < 80     table-warning
60 <= Age < 70     table-info

如何为我的网格添加此 CSS 类？

谢谢

Answer 1

您应该使用rowatr，它通知 jqGrid 在生成行期间应将哪些附加属性(类、标题、样式等)分配给网格的行 。回调的示例如下

rowattr: function (item) {
    if (item.Age >= 80) {
        return { "class": "table-danger" };
    } else if (70 <= item.Age && item.Age < 80) {
        return { "class": "table-warning" };
    } else if (60 <= item.Age && item.Age < 70) {
        return { "class": "table-info" };
    }            
}

参见the old answer代码示例。