Column grouping (colspan, rowspan) and aoColumnDefs with bVisible as false
Column grouping (colspan, rowspan) and aoColumnDefs with bVisible as false
dimeg
Posts: 9Questions: 0Answers: 0
Just updated to 1.7.5 from early version. aoColumnDefs nice feature, but have problem here.
I have a table with column grouping (taken from examples page):
[code]
Rendering engine
Browser
Group
Platform(s)
Engine version
CSS grade
Trident
Internet
Explorer 4.0
Win 95+
4
X
....
[/code]
If i use no aoColumnDefs it works fine, but if I use such code:
[code]
$(document).ready(function() {
var columns = [
{"bVisible": false, "aTargets":["invisible"]}
];
$('#example').dataTable({
"aoColumnDefs": columns
});
});
[/code]
It removes not only "Rendering engine" but also and "Platform(s)". What can be wrong here? Can I overcome this issue without hucks? :)
I have a table with column grouping (taken from examples page):
[code]
Rendering engine
Browser
Group
Platform(s)
Engine version
CSS grade
Trident
Internet
Explorer 4.0
Win 95+
4
X
....
[/code]
If i use no aoColumnDefs it works fine, but if I use such code:
[code]
$(document).ready(function() {
var columns = [
{"bVisible": false, "aTargets":["invisible"]}
];
$('#example').dataTable({
"aoColumnDefs": columns
});
});
[/code]
It removes not only "Rendering engine" but also and "Platform(s)". What can be wrong here? Can I overcome this issue without hucks? :)
This discussion has been closed.
Replies
I'm using a complex header (row and colspan), whenever I use bVisible to hide a row it hides the target row and one of the rows in the bottom line
has anyone encountered this problem before?
I'm sorry to say that this is a limitation in the DataTables code for showing and hiding columns at the moment. You can get the same effect using the following code:
[code]
var oTable = $('#example').dataTable();
oTable.fnSetColumnVis( 0, false );
[/code]
Basically the column visibility in DataTables doesn't cope with rowspan / colspan as it would be quite complicated to support that. I would like to, but haven't had the time to put this feature in yet (this limitation is noted in the fnSetColumnVis documentation: http://datatables.net/api#fnSetColumnVis ).
Regards,
Allan
1) Define a css class to hide elements (name it as you wish):
[code]
invisible{
display: none;
}
[/code]
2) Apply the class to the colum instead of use bVisible
[code]
$('#example').dataTable({
{ //hide columns
"sClass": "invisible",
"aTargets": [ 0, ... ]
}
});
[/code]
Allan
Hugo
Allan
This seems to work when tables have complex headers but when they don't you can notice an empty column where the hidden column used to be.
In some tables this only happens after changing the number of lines per page or after switching pages so I think it's caused by the way datatables redraws the table..
edit: ok, maybe not a problem with datatables after all (sorry allan) as I did some testing and this is only happening in IE.
Allan
Hugo