jqGrid更改特定列標題的背景顏色

我有一個jqGrid並需要更改某些標題列組的背景顏色。我可以很容易地在colModel中使用{classes：「ColIndicator」}來做到這一點，但在標題中沒有這個選項。處理這種情況的最佳方法是什麼？jqGrid更改特定列標題的背景顏色

編輯：實施例編號：

$("#" + subgrid_table_id).jqGrid({ 
    url: "@Url.Action("GetInvalidItemsVendorItemsJson")", 
    datatype: "json", 
    postData: { itemUpc: $("#invalid-items-grid").getRowData(row_id)["i"] }, 
    autowidth: true, 
    colNames: [ 
     'Vendor', 'Store Number', 
     'Item Code', 
     'Source1 Description', 'Source1 Case Pack', 'Source1 Size', 'Source1 Case UPC', 
     'Source2 Description', 'Source2 Case Pack', 'Source2 Size', 'Source2 Case UPC', 
     'Source3 Description', 'Source3 Case Pack', 'Source3 Size', 'Source3 Case UPC' 
    ], 
    colModel: [ 
     { name: 'Vendor', index: 'Vendor', classes: "Key" }, 
     { name: 'StoreNumber', index: 'StoreNumber', classes: "Key" }, 
     { name: 'ItemCode', index: 'ItemCode', classes: "Key" }, 
     { name: 'Source1Description', index: 'Source1Description', classes: "Source1" }, 
     { name: 'Source1CasePack', index: 'Source1CasePack', classes: "Source1" }, 
     { name: 'Source1Size', index: 'Source1Size', classes: "Source1" }, 
     { name: 'Source1CaseUpc', index: 'Source1CaseUpc', classes: "Source1" }, 
     { name: 'Source2Description', index: 'Source2Description', classes: "Source2" }, 
     { name: 'Source2CasePack', index: 'Source2CasePack', classes: "Source2" }, 
     { name: 'Source2Size', index: 'Source2Size', classes: "Source2" }, 
     { name: 'Source2CaseUpc', index: 'Source2CaseUpc', classes: "Source2" }, 
     { name: 'Source3Description', index: 'Source3Description', classes: "Source3" }, 
     { name: 'Source3CasePack', index: 'Source3CasePack', classes: "Source3" }, 
     { name: 'Source3Size', index: 'Source3Size', classes: "Source3" }, 
     { name: 'Source3CaseUpc', index: 'Source3CaseUpc', classes: "Source3" }, 
    ], 
    loadonce: true, 
    gridComplete: function() { 
     if ($(this).getDataIDs().length == 0) { 
      $("#" + subgrid_table_id).remove(); 
      $("#" + subgrid_id).html("<div class=\"records-not-found\">No records found for upc <span>" + $("#invalid-items-grid").getRowData(row_id)["i"] + "</span> in Source1, Source3 or Source2</div>"); 
     } 
    } 
});

注意，需要有多個樣式（對於每個在源1源2 Source3）在網格中。

來源

2014-10-16 C Bauer

可以使用setLabel方法將類添加到列標題或在<th>元素上分配屬性。例如$("#" + subgrid_table_id).jqGrid("setLabel", "StoreNumber", false, "ui-state-highlight");會將"ui-state-highlight"類添加到「StoreNumber」列的列標題中，並且它將以background-color和background-image的方式更改。

此外，我不會建議您使用$(this).getDataIDs().length == 0來測試網格中的記錄數。方法getDataIDs更多，因爲你需要。而不是那麼你應該使用reccountoption和測試$(this).getGridParam("reccount") === 0。您應該將重要選項gridview: true添加到網格，這隻會提高網格的性能（有關詳細信息，請參閱the answer）。我建議您從colModel刪除所有不需要的index屬性。它會減少代碼，但代碼將會保持不變。

來源

2014-10-16 16:43:15 Oleg

這工作，但我的CSS正在被網格CSS覆蓋。有小費嗎？ – 2014-10-16 16:53:25

@C鮑爾：你應該發佈你使用的CSS規則:-)最常見的問題是定義不夠具體的CSS規則或不刪除'background-image'。 – Oleg 2014-10-16 16:58:24

是的，我試圖添加'.Source1'。我也嘗試過'th.Source1'，因爲我不能打所有的字段，只能打這個字段。 – 2014-10-16 16:59:38

jqGrid更改特定列標題的背景顏色

回答

相關問題