将CSS类添加到列中

Question

如何将自己的类添加到jqgrid中的列。正如我看到html输入元素正在获取类“FormElement”。我需要在特定列中添加一个类。我找到了这个http://www.trirand.com/blog/?page_id=393/help/cell-tooltip-1/#p21526，但我不确定它是否是实现这一目标最方便的方法？我的意思是遍历所有行和单元格，然后手动更改类属性 - 这似乎是这种“简单”任务的开销。

更新

我想添加类，因为我想使用此多选择小部件http://quasipartikel.at/multiselect/的功能。此小部件通过定义的类工作。这就是原因。

Answer 1

您可能需要对相应的列使用classes属性。

我不确定这是否是您所需要的，因为您撰写了关于表单中存在的FormElement类的内容。在这种情况下，您必须使用表单编辑的beforeShowForm回调，例如将类添加到编辑表单的相应字段的输入字段中。表单中字段的ID与name的相应列的colModel属性相同。

如果确实需要将class属性添加到一列的单元格中，则还有一种可能性：为cellattr列定义colModel回调。如果您需要添加类而不是列的所有单元格，那么这种方法可能是实用的。您可以根据行内容测试某些条件，并仅在条件发生时设置类。例如，classes:'ui-state-error-text ui-state-error'的使用会在列上的所有单元格上设置相应的两个类（ui-state-error-text和ui-state-error）。另一方面是回调函数

cellattr: function(rowId, val, rawObject) {
    if (parseFloat(val) > 200) {
        return " class='ui-state-error-text ui-state-error'";
    }
}

允许您仅在单元​​格值高于200时设置类。我在上面的回调中没有使用rawObject，因此可以删除可选参数。我在回调中添加它只是为了提醒您可以使用该参数来访问该行的另一个列中的值。因此，您可以在cellattr中实现更复杂的方案。

结果可以得到如下图所示的网格：

更新：如果您需要在编辑论坛的输入字段中添加class，则可以另外使用editoptions的dataInit回调。在这种情况下使用将非常简单。您可以执行以下操作：

editoptions: {
    dataInit: function (domElem) {
        $(domElem).addClass("ui-state-highlight");
    }
}

结果您将获得编辑表格，如

您可以找到here的演示。

Answer 2

有一个classes colmodel选项可以满足您的需求。来自jqGrid documentation：

  

类

     

的字符串

     

此选项允许向列添加类。如果将使用多个类，则应设置空格。通过示例classes:'class1 class2'将class1和class2设置为该列上的每个单元格。

     

在网格css中有一个预定义的类ui-ellipsis，它允许将省略号附加到特定行。这也适用于FireFox。