Custom Classes
Custom Classes
I am trying to use only some of the jQuery UI css styling with the dataTable. Rather than setting "bJQueryUI": true, I am hoping to apply parts of the css using the custom class method.
However, with my initial testing I have already come across a problem, when trying to style the Sort Asc/Desc icons, I seem to be getting all the icons in a single column header?? e.g. up, down, left right, etc...almost as if the ui-icon style for sizing is not applied. Does the class support multiple css styles?
[code]
.css_right {
float: right;
}
$.fn.dataTableExt.oStdClasses.sSortAsc = "css_right ui-icon ui-icon-triangle-1-n";
$.fn.dataTableExt.oStdClasses.sSortDesc = "css_right ui-icon ui-icon-triangle-1-s";
$(document).ready(function() {
$('table').dataTable();
});
[/code]
When trying a simple test as below, the correct expected icon is displayed so i know the CSS is loading ok.
[code]
[/code]
Has anyone else tried to do this and been successful?
However, with my initial testing I have already come across a problem, when trying to style the Sort Asc/Desc icons, I seem to be getting all the icons in a single column header?? e.g. up, down, left right, etc...almost as if the ui-icon style for sizing is not applied. Does the class support multiple css styles?
[code]
.css_right {
float: right;
}
$.fn.dataTableExt.oStdClasses.sSortAsc = "css_right ui-icon ui-icon-triangle-1-n";
$.fn.dataTableExt.oStdClasses.sSortDesc = "css_right ui-icon ui-icon-triangle-1-s";
$(document).ready(function() {
$('table').dataTable();
});
[/code]
When trying a simple test as below, the correct expected icon is displayed so i know the CSS is loading ok.
[code]
[/code]
Has anyone else tried to do this and been successful?
This discussion has been closed.