Hide grouped columns with colspan

cgaray

Hi, i have a table with grouped columns (with colspan and rowspan), something like this:
[code]



H1
H2
H3
H4


H3.1
H3.2
H4.1
H4.2


[/code]
When i try to hide the first o second column there's no problem and the column gets hidden, i just do:
[code]
$table.fnSetColumnVis(0,false);
[/code]
But i can't hide the columns with header H3, H3.1, H3.2, H4, H4.1 and H4.2, no matter the column index i give to the fnSetColumnVis function.. fnSetColumnVis(2,false) doesn't hide the column with header H3 neither the one with header H3.1.. Maybe someone already found a solution for this.. Thanks

allan

Hi cgaray,

I'm sorry to say that DataTables' handling of multiple rows in THEAD currently leaves something to be desired. It's not bad, but as you are seeing it's not perfect. So there a number of points here:

1. DataTables currently only allows one unique TH element for each column.
2. I'm not sure that your HTML is valid due to the two colspans (which would suggest 6 columns in total)
3. fnSetColumnVis is a little bit rubbish when dealing with multiple rows - something on the to-do list...

The way to get around 1. is to use TD elements for secondary column headers, keeping only one unique TH for each column. For 2, I think you need to delete the two colspans. For 3. this is a bit more trick as it involves modifying fnSetColumnVis. It's a reasonably straight forward modification to add support for adding/removing TDs, but it's not in the code base yet.

Hope this helps somewhat!

Regards,
Allan

cgaray

Thanks allan, i'm currently trying to modify the function fnSetColumnVis so it can handle multiple rows in THEAD, if i get something decent i'll share it here.. Thanks anyway

allan

Hi cgaray,

That would be awesome if you could share you code if you do make any headway with this. :-)

Regards,
Allan

pktm

It has been a while, so I guess there was no sucess in coding that multiple thead rows stuff.

I came across a similar problem today. When I set multiple rows in a table, only the first columns were hidden.

Here is an example table:
[code]
$(document).ready(function() {

$('#example').dataTable( {
"aoColumns": [
{ "bVisible": false },
null,
null,
]
} );
} );




1.1
1.2
1.3>


2.1
2.2
2.3





[/code]

My solution: If JavaScript is turned on, $(document).ready() is executed. So it can delete the "hidden" cell here.
[code]
$(document).ready(function() {
// nasty design stuff to account for JavaScript turned on/off
$('#example tr:eq(1) td:eq(0)').remove();
}
[/code]

Of course, this is only a nasty hack :)

hth, pktm

bobs325

I too was hoping for a fix here, and attempted to loop through multiple rows in a element within fnSetColumnVis() but I get errors when it's called:

Error: uncaught exception: [Exception... "Node was not found" code: "8" nsresult: "0x80530008 (NS_ERROR_DOM_NOT_FOUND_ERR)" ...

Anybody have any luck?

dpaustin

Another question: how can multiple header lines with colspan be accomplished through json initialization.