Bug in _fnDrawHead ; Ver 1.10.4

womplify

Hi there.
I have discovered a strange bug, that occurs under unique circumstances, yet very annoying..

I am using DataTables with a template called smartAdmin.
The but though is not with the template, but with DataTables.
Am not sure how to replicate the problem without it, but here is the bug..

When switching between pages in the template, it seems to trigger a table redraw, I am guessing, because it is triggering the _fnDrawHead.
The problem is that inside _fnDrawHead, there is this bit of code...

/* Expand the cell to cover as many rows as needed */
while ( aoLocal[i+iRowspan] !== undefined &&
    aoLocal[i][j].cell == aoLocal[i+iRowspan][j].cell )
{
    aApplied[i+iRowspan][j] = 1;
    iRowspan++;
}

The code goes over the columns in the table, represented in aoLocal[0] and aoLocal[1], supposedly.
However.. it seems to include "fake" columns due to complex table headers that use colspan.
What happens is that it thinks that a <th> element is a column, while it os only a grouping element for 5 columns "under" it.
That causes the code to break, as it actually thinks the table has an extra column (in my case, 11th column, while there are only 10)

I would greatly appreciate help with this.
Looking forward to a bug-fix.
Best,
Ron

tangerine

....due to complex table headers that use colspan.

Many people are using DataTables with complex headers with no problem.
Are you sure your HTML is valid?

womplify

No.
In fact, your post, made me look into the problem further and made me find a bug in the HTML part of the table definition.
The table definition included a hidden column (class="never"). It was properly hidden, and the table was properly functioning all around. However, there was one thing missing from that column definition in the table header...

<th class="never">URLID</th>

What was missing is: rowspan="2"
HTML is pretty flexible, and not having this defined is no problem for the browser to deal with. Even when visible, all works fine, as it is the last column, and even without rowspan="2" the table behaves perfectly, as a table in the DOM.
However, DataTable, it seems, gets "confused". I am not sure why exactly, or why adding this solves the problem (yes, I know that adding it is the right way to go).
So, when you asked me if I was sure the HTML is valid, it made me look back with a more critical eye into the HTML itself (rather than the JS part, even of the table initialization).

So... from my end,p problem solved.

I think DataTables (at least in the non-minified version at least) could actually greatly benefit from (more) intensive some sanity checks and more verbose error handling.
In this case for example, in this case - making sure that the columns definition perfectly matches the table HTML/DOM definition. There are various cases I have seen, table definition that is not 100% correct, causes JS exception/errors which often only show in the console log, as a very cryptic JS error.
This is certainly not a critical aspect, but certainly one that helps people properly implement/use the tool. Just my 2 cents..

Cheers, and thanks for raising that doubt about my table's HTML.
Ron

allan

Hi - great to hear that @tangerine's suggestion helped to find and fix the issue with the HTML.

not having this defined is no problem for the browser to deal with.

That is true, but browsers have to be able to cope with invalid HTML and have millions of lines of code to cope with what to do in those cases. "Tag soup" I've heard the WebKit folks as referring to it before. I don't have that luxury in DataTables, so it has to assume valid HTML.

Adding additional debugging and error detection code isn't really an option in DataTables core since it would add additional code that would be unused the majority of the time - however(!), I've long wanted to create a debug version of DataTables that would add a ton of debug message and error checking. Unfortunately I've just not had time to do it yet. One day :-)

Regards,
Allan

Looooooka

Same problem here.
Didn't have a problem with previous versions.

allan

@Looooooka - the problem is that you are using invalid HTML? Or something else? Can you link to the page?

Allan

Looooooka

Valid html.
But in my case I dynamically update the header on init complete.(I add 2 rows to thead... to add some custom filtering options)
In combination with zurb foundation's reveal effects I get the exception.
When the grid is hidden and then shown again the exception is raised.
The fix right now is to remove the rows when calling reveal close. The code that adds them is ran on datatables initialization and the datatable is recreated when reveal show is called. So while it isn't a fix which would make me super happy...it does fix the problem so I'm ok with it :)

allan

I would need a link to a test case showing the issue so I can debug it please.

Allan