禁用jQuery數據表中的排序類v 1.10

我正在更改我的數據錶行的背景顏色。這適用於所有的單元格，除了我所選的單元格之外。禁用jQuery數據表中的排序類v 1.10

看來發生這種情況的原因是應用於排序列的sorting_1類。

要解決這個問題，我創建了自己sorting_1類在我的css文件是這樣的：

.sorting_1 { 
    background-color: inherit !important; 
}

這解決了這個問題，但我不能不認爲有更好的方式來做到這一點。另外，我的黑客不會處理sorting_2，sorting_3等，（即使我目前不使用）

我試圖改變的

$.fn.dataTableExt.oJUIClasses.sSortColumn

的價值，但我顯然沒有做到這一點正確。任何人都知道一個更清潔的方式來做到這一點

來源

2016-08-01 Somaiah Kumbera

你想排序功能或不是？ –

是的，我想要排序功能留下來。我只是不想讓sorting_ *類隱藏我設置的行的背景顏色 –

你沒有告訴dataTables你想jQueryUI渲染。這樣做是這樣的：

var table = $('#example').dataTable({ 
    bJQueryUI: true 
})

這指示數據表使用$.fn.dataTableExt.oJUIClasses，否則 $.fn.dataTableExt.oStdClasses使用（這是你的主要問題）

現在的等級順序是非常重要的。如果你想添加一個myClass設置背景的一些其它顏色（這是你想要的）：

$.fn.dataTableExt.oJUIClasses.sSortColumn = 'myClass sorting_';

如果你想跳過 sorting_x完全

$.fn.dataTableExt.oJUIClasses.sSortColumn = 'myClass';

將導致myClass_1，myClass_2

和等等。

$.fn.dataTableExt.oJUIClasses.sSortColumn = 'sorting_ myClass';

會把事情搞得一團糟。小演示 - >http://jsfiddle.net/f6qLqyao/

這裏是所有默認oJUIClasses類的完整列表：

sFilter: "dataTables_filter" 
sFilterInput: "" 
sFooterTH: "ui-state-default" 
sHeaderTH: "ui-state-default" 
sInfo: "dataTables_info" 
sJUIFooter: "fg-toolbar ui-toolbar ui-widget-header ui-helper-clearfix ui-corner-bl ui-corner-br" 
sJUIHeader: "fg-toolbar ui-toolbar ui-widget-header ui-helper-clearfix ui-corner-tl ui-corner-tr" 
sLength: "dataTables_length" 
sLengthSelect: "" 
sNoFooter: "no-footer" 
sPageButton: "fg-button ui-button ui-state-default" 
sPageButtonActive: "ui-state-disabled" 
sPageButtonDisabled: "ui-state-disabled" 
sPaging: "dataTables_paginate fg-buttonset ui-buttonset fg-buttonset-multi ui-buttonset-multi paging_" 
sProcessing: "dataTables_processing" 
sRowEmpty: "dataTables_empty" 
sScrollBody: "dataTables_scrollBody" 
sScrollFoot: "dataTables_scrollFoot ui-state-default" 
sScrollFootInner: "dataTables_scrollFootInner" 
sScrollHead: "dataTables_scrollHead ui-state-default" 
sScrollHeadInner: "dataTables_scrollHeadInner" 
sScrollWrapper: "dataTables_scroll" 
sSortAsc: "ui-state-default sorting_asc" 
sSortColumn: "sorting_" 
sSortDesc: "ui-state-default sorting_desc" 
sSortIcon: "DataTables_sort_icon" 
sSortJUI: "css_right ui-icon ui-icon-carat-2-n-s" 
sSortJUIAsc: "css_right ui-icon ui-icon-triangle-1-n" 
sSortJUIAscAllowed: "css_right ui-icon ui-icon-carat-1-n" 
sSortJUIDesc: "css_right ui-icon ui-icon-triangle-1-s" 
sSortJUIDescAllowed: "css_right ui-icon ui-icon-carat-1-s" 
sSortJUIWrapper: "DataTables_sort_wrapper" 
sSortable: "ui-state-default sorting myClass" 
sSortableAsc: "ui-state-default sorting_asc_disabled" 
sSortableDesc: "ui-state-default sorting_desc_disabled" 
sSortableNone: "ui-state-default sorting_disabled" 
sStripeEven: "even" 
sStripeOdd: "odd" 
sTable: "dataTable" 
sWrapper: "dataTables_wrapper"

來源

2016-08-01 11:00:05 davidkonrad

優雅的解決方案，以及詳細解釋清楚的答案。謝謝。 –

是的，肯定有更乾淨的方法來做到這一點。從datatables站點查看this doc。 DataTables在樣式上高度可定製。特別是，您應該可以使用theme creator來創建任何您想要的樣式。

順便說一下，DataTables用於排序的CSS類是sorted_1，sorting_2和sorting_3，就像您擁有它們一樣。所以，如果你的是一個黑客，那麼他們也是。另外，用戶可以通過按住Shift鍵並點擊一列接一列地排序多列，所以也許您會希望支持該列，因爲無論您是否真的使用它，您的應用程序都可以讓用戶使用它。

來源

2016-08-01 09:21:22 BobRodes

我只對此答案+1了，因爲您指出（正確）sort_2，sorting_3等可能會混淆樣式。但是davidkonrad有一個工作解決方案，所以我接受了他的答案。感謝您的反饋。僅供參考 - 主題創建者不處理排序/過濾/訂購樣式 –

是的，我注意到，不直接處理它。不過，我在發佈之前就研究了我的答案。我建議你看看生成的CSS，Allan提到你可以改變你喜歡的任何方式。你會看到所有的排序樣式。 davidkonrad的答案肯定比我的更詳細，所以我也會接受它作爲答案。但是如果我使用這個，我仍然會熟悉DataTables工具。我最近編寫了我的第一個jQuery UI和DataTables應用程序，並跳過了自己的CSS，現在有一個相當長的文件，因爲它。 – BobRodes

禁用jQuery數據表中的排序類v 1.10

回答

相關問題