Question

在编辑一行（模式内联）之后，我尝试根据新值更改单元格的某些css属性。

通常：编辑一行后，包含字母“D”的该行的所有单元格都使用新的css属性更新单元格：background-color：gray（使用setCell方法）

为此，我使用内联编辑：

grid.jqGrid('navGrid',"#pager",{edit:false, add:false, del:false});
grid.jqGrid('inlineNav',"#pager",{edit:true, add:false, del:false, editParams: myEditParam});

为了在编辑后更改背景，我使用方法aftersavefunc

myEditParam :
...
    aftersavefunc: function(rowId, dataFromServer)
    {
      var rowData = $("#list").jqGrid("getRowData", rowId);
      for (var key in rowData)
      {
        if (rowData[key] == "D")
        {
          key++;
          $("#list").jqGrid("setCell",rowId, key, "", {"background-color": "#ECECEC"}  );
        }
      }
    },
...

这段代码有效，但不幸的是，当我对网格的一列进行排序时，setCell方法没有得到保留！（细胞丢失了它的背景颜色：灰色）

在使用新值进行编辑后，是否存在更改背景的更好方法？

谢谢你的帮助;）

Answer 1

我建议从该事件中删除Style，而不是将其移动到下面的更一般的功能。如果未应用样式，您始终可以在jqGrid上触发刷新，作为后编辑代码的一部分。

以下函数将检查每个列单元格值，如果TestValue匹配，则将该类添加到该行。

    rowattr: function (rd) {
           if (rd.ColumnName == TestValue) { return {"class": "RowBoldClass"}; }//if
    },

和匹配类

RowBoldClass { font-weight:bold; .....

我的答案来自Making a row bold, changing background color - dwr

Answer 2

如果您确实需要更改值为“D”的列中单元格的格式/颜色/样式，则应使用cellattr（请参阅{{3} }或the answer）。

如果您需要更改行的格式/颜色/样式，则应使用rowattr（请参阅this one）。

有一点很重要：在行编辑结束时不会调用cellattr和rowattr。因此，您仍然必须使用aftersavefunc回调。

aftersavefunc的当前代码似乎有点奇怪。首先，我从未要求根据值（在您的情况下为“D”）标记网格的任何列中的值。通常，只需要测试值的特定列或列，然后标记单元格或标记行中的其他单元格。

通过任何方式，通常不仅仅需要在值中添加类将为“D”，但如果值不是“D”，则删除类。

我从the answer修改了演示以支持内联编辑（应该使用双击开始编辑，然后按 Enter 停止编辑）。 the answer 使用旧版演示中使用的aftersavefunc以下cellattr代码：

aftersavefunc: function (rowId) {
    var closed = $(this).jqGrid("getCell", rowId, "closed"), indexOfColumn;
    if (closed === "Yes") {
        // add CSS classes to the cell used to mark
        $(this).jqGrid("setCell", rowId, "name", "",
           "ui-state-error ui-state-error-text");
    } else {
        // remove CSS classes from the cell used to mark
        indexOfColumn = getColumnIndexByName.call(this, "name");
        $(this.rows.namedItem(rowId).cells[indexOfColumn])
            .removeClass("ui-state-error ui-state-error-text");
    }
}

排序列时，JqGrid setCell属性丢失

2 个答案: