jqgrid：如何在生成时设置特定于单元格的css类

我正在构建一个jqgrid，它需要为特定单元格提供不同的背景（或者通常是不同的css类）值。我知道哪些单元格需要在生成发送到jqgrid的数据时应用该类。我希望能够在jqgrid rows结构中为每个特定单元格指定一个类：

<rows>
  <page> </page>
  <total> </total>
  <records> </records>
    <row>
      <cell>1.00</cell>
      <cell class='errorClass'>15.00</cell>
      <cell class='warningClass'>9.00</cell>
        …
    </row>
    <row>
      <cell>1.00</cell>
      <cell>2.00</cell>
      <cell>1.15</cell>
        …
    </row>
      …
</rows>

1
15
9
…
1
2
1.15
…
…

我知道我可以在数据发送下来后进行格式化，但我希望看到在适当的位置使用格式绘制网格，而不是在事实发生之后

通过在单元格中使用标记进行设置，我实现了我想要的结果：

<cell><span class='warningClass'>3.00</span></cell>

3.00

---

但是它没有为整个单元格设置类，只为其中的数据设置类，只突出显示文本，而不是整个单元格。

我觉得你的问题很有趣，所以我为你做了准备

如果要在网格单元（

元素）上设置一些自定义属性，如

类

，

标题

，

colspan

，

样式

是最好的方法（有关详细信息，请参阅）

cellattr

接近功能，但允许定义单元格的属性，而不是单元格包含的属性

在中，我使用了以下XML输入：

<?xml version='1.0' encoding='utf-8'?>
<rows>
<page>1</page><total>1</total><records>2</records>
    <row id='13'>
        <cell>1.00</cell>
        <cell class='ui-state-error'>15.00</cell>
        <cell>9.00</cell>
    </row>
    <row id='12'>
        <cell>1.00</cell>
        <cell>2.00</cell>
        <cell class='ui-state-highlight'>1.15</cell>
    </row>
</rows>

在这种情况下，第二个（“：eq（1）”单元格的“class”属性将用于格式化

---

从设计的角度来看，我建议您不要直接使用类名作为属性。类似于

format=“error”

的替代属性将转换为

class='ui-state-error'

有一些优点。它可以将格式化提示等信息与直接HTML指令分离。

使用Oleg的答案，我使用动态创建的colModel（colM）对以下内容进行了测试：

在哪里

function findColModelInList(colModel, modelList)
{
    var index = 0;
    var retval = -1;
    for each (var modelItem in modelList)
    {
        if (modelItem.name == colModel.name)
        {
            retval = index;
        }
        index++;
    }
    return retval;
}

---

为什么必须在呈现数据时而不是在事实发生后执行此操作？不幸的是，我不认为jqGrid内置了任何东西来在生成时设置样式，至少在我的经验中没有。我总是事后才做。如果我想更改jqgrid添加/编辑表单的css，该怎么办？谢谢你的回答。我的问题涉及一个动态创建的列模型，因此我必须找到一种方法将cellattr函数附加到json列模型。对于我的情况，您的解决方案提出的真正问题是如何确定用于返回类的列号。最后，我将cm.name参数与col模型项的json列表进行比较，并使用找到的列表索引来确定“cell:eq（n）”的值。哦，我不得不升级到jqgrid 4.x。“那对我来说也浪费了一些时间。”比尔菲弗：好的，我明白了。我修改了演示：看。在使用您发布的

findColModelInList

时应小心。每个循环都没有

。对于（模型列表中的var modelItem）

，至少应使用

。还有一条建议：如果确实需要的话，不要在

JavaScript循环中使用

for。使用简单的
for
循环枚举数组更有效。@Oleg Nice！如果您可以扩展它以添加单元格高亮显示功能，则将非常有用。我们是否可以在焦点上为单元格（或者可能是整个列）指定高亮显示的颜色？@Deb：如果我理解并纠正你的问题，你可以使用我提出的想法。这个演示可以在其他控件上悬停。如果我想更改jqgrid的添加/编辑表单的css，该怎么办？
for each (var colModelItem in colM)
{
   colModelItem.cellattr = function (rowId, val, rawObject, cm, rdata){
      var pos = findColModelInList(cm, colM);
      var srchText = 'cell:eq(' + pos + ')';
      var c = jQuery(srchText, arguments[2]).attr('class');
      return c ? " class='" + c + "'": "";
   };
}

function findColModelInList(colModel, modelList)
{
    var index = 0;
    var retval = -1;
    for each (var modelItem in modelList)
    {
        if (modelItem.name == colModel.name)
        {
            retval = index;
        }
        index++;
    }
    return retval;
}