DataTables on a table with less headers than TDs

skalugerov

Hello,
Let's have this table for example - https://jsfiddle.net/vjuk9w4a/3/
It has less headers than TDs. This gives me the following error -

Uncaught TypeError: Cannot read property 'mData' of undefined
at HTMLTableCellElement.<anonymous> (jquery.dataTables.min.js:89)
at Function.each (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1)
at i.fn.init.each (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1)
at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:89)
at Function.each (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1)
at i.fn.init.each (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1)
at i.fn.init.m [as dataTable] (jquery.dataTables.min.js:82)
at i.fn.init.h.fn.DataTable (jquery.dataTables.min.js:164)
at HTMLDocument.eval (eval at globalEval (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1), <anonymous>:20:29)
at l (jqueryMobile?v=bwRkGcG-EeBCg6lPzCRTxXuz2KCPioHc_CjAUHwu5H01:1)

Is there any workaround for this ? I don't need to sort by the header that has 3 columns, just the other ones.

tangerine

The HTML for your table is invalid. You have to have the same number of th's as td's.
You need to use "complex" headers:
https://datatables.net/examples/basic_init/complex_header

kthorngren

This example explains how to use colspan in the thead.
https://datatables.net/examples/basic_init/complex_header.html

Kevin

skalugerov

I do not wish to have headers above the headers. Is there no other way ?

kthorngren

I do not wish to have headers above the headers. Is there no other way ?

No, as explained in the page I linked:

Each column must have one TH cell which is unique to it for the listeners to be added.

Kevin