如何从jqGrid单元格中删除CSS类?

时间:2011-06-14 15:47:04

标签: css jqgrid

可以使用setCell方法将CSS类添加到jqGrid单元格中,如下所示。

grid.setCell(rowId, "ColumnName", "", "my-style-class");

考虑到此方法只能添加 CSS类,如何从jqGrid单元格删除 CSS类?

2 个答案:

答案 0 :(得分:11)

无法使用标准jqGrid方法删除调用类。所以你必须手动完成这个:

var iCol = getColumnIndexByName(grid,"ColumnName"),
    tr = grid[0].rows.namedItem(rowid), // grid is defined as grid=$("#grid_id")
    td = tr.cells[iCol];
$(td).removeClass("my-style-class");

其中getColumnIndexByName是一个简单的函数,它通过列名获取列索引:

var getColumnIndexByName = function(grid,columnName) {
    var cm = grid.jqGrid('getGridParam','colModel');
    for (var i=0,l=cm.length; i<l; i++) {
        if (cm[i].name===columnName) {
            return i; // return the index
        }
    }
    return -1;
}

请参阅演示here

已更新Free jqGrid具有iColByName内部参数,可用于代替getColumnIndexByName功能。 iColByName参数将在内部由免费的jqGrid填充,它将通过重新排列列进行更新。所以使用

是安全的
var p = grid.jqGrid("getGridParam"), // get the reference to all parameters
    iCol = p.iColByName["ColumnName"], // get index by column name
    cm = p.colModel[iCol]; // item of "ColumnName" column

方式非常简单,而且工作非常快。人们应该考虑在免费jqGrid 4.8发布之后,该功能包含在免费的jqGrid 中。因此,必须从GitHub下载最新的源代码或至少使用免费的jqGrid 4.9-beta1来获得该功能。

答案 1 :(得分:1)

通过将旧类删除为:

,可以轻松地将新类添加到单元格中
$("#gridname").removeClass('oldclass')
              .setCell(rowId,'column_name','','newclass');

其中rowId是包含相应单元格的行的id,可以获取为:

var ids = $("#gridname").jqGrid('getDataIDs');