將CSS類添加到列中

如何將自己的類添加到jqgrid中的列中。正如我看到的HTML輸入元素獲得類「FormElement」。我需要添加一個類到一個特定的列。我發現這個http://www.trirand.com/blog/?page_id=393/help/cell-tooltip-1/#p21526，但它不知道它是否是實現此目的最便捷的方法？我的意思是遍歷所有行和單元格，然後手動更改類屬性 - 這似乎是這種「簡單」任務的開銷。將CSS類添加到列中

UPDATE

我要添加類，因爲我想用這個多選小部件http://quasipartikel.at/multiselect/的功能。這個小部件通過定義的類工作。這就是爲什麼。

來源

2012-08-29 Anatoliy

有一個classes colmodel選項，只是你所需要的。從jqGrid documentation：

類

串

該選項允許類添加到列。如果使用多個類，則應設置空格。例如classes:'class1 class2'將爲該列上的每個單元設置一個class1和class2。

在網格CSS中有一個預定義的類ui-ellipsis，它允許將省略號附加到特定的行。此外，這也可以在FireFox中使用。

來源

2012-08-29 14:56:13

謝謝賈斯汀，我不知道這個選項。正如我所說，我知道這應該是特別的東西。 – Anatoliy

可能您需要使用classes屬性作爲相應的列。

我不確定這是你需要什麼，因爲你寫了FormElement類別。在這種情況下，您必須使用beforeShowForm表單編輯回調來將類添加到編輯表單相應字段的輸入字段。表單中字段的ID與colModel對應列的name屬性相同。

如果您確實需要將類屬性添加到一列的單元格中，則還有一種可能性：爲colModel列定義cellattr回調。如果您需要添加類而不是列列的所有單元格，該方法可能很實用。您可以根據行內容測試一些條件，並僅在條件發生時才設置類。例如，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中實施更復雜的場景。

其結果是一個能獲得像以下圖片網格：

enter image description here

修訂：如果您需要在編輯的輸入字段中添加class印版，你還可以使用dataInit回調editoptions。在這種情況下，使用會非常簡單。例如，您可以執行以下操作：

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

其結果是，你會得到編輯表單像

enter image description here

你可以找到here演示。

來源

2012-08-29 14:56:39 Oleg

非常感謝Oleg提供了一個全面的答案，我認爲beforeShowForm對我來說更合適，因爲我只需要在表單編輯中使用它。 – Anatoliy

@Anatoliy：不客氣！ dataInit'的用法對你來說可能更爲實用：參見我的答案的** UPDATED **部分。 – Oleg

是的，它工作正常。它真的看起來是實現這個目標的最短途徑。太感謝了！同樣很高興看到，至少有三種方法可以解決這個問題。 – Anatoliy

將CSS類添加到列中

回答

相關問題