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更改特定列标题的背景颜色

回答

相关问题