Multiple header breaks datatable functionality

Multiple header breaks datatable functionality

NoBullManNoBullMan Posts: 95Questions: 28Answers: 2

Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:
I am in the process of upgrading from 1.10 to 2.3.2. I managed most of the updates but one thing took me a while to sort out and I wanted to check with you.

HTML table has two header rows. The second row's total number of column is larger them total of top row's spanning columns, like below:

<table id="blah" class="...">
    <thead>
        <tr>
            <th colspan="2">Set 1</th>
            <th colspan="3">Set 2</th>
        </tr>
        <tr>
            <th>Col 1</th>
            <th>Col 2</th>
            <th>Col 3</th>
            <th>Col 4</th>
            <th>Col 5</th>
            <th style=display:none">Col 6</th>
        </tr>
    <thead>
    <tbody>
    </tbody>
    <tfoot>
    </tfoot>
<table id="blah" class="...">

Note that total of spanned columns is 5 and total of single span columns is 6.

This worked fine in 1.10 but broke in 2.3.2, throwing an exception in datatbles.js, in "__column_header = function (settings, column , row), with "TypeError: cannot read properties of undefined (reading 'unique')".
I found out that I had to add another <th> to first row, making it below to make the total number of columns match, or delete the first header row:

<table id="blah" class="...">
    <thead>
        <tr>
            <th colspan="2">Set 1</th>
            <th colspan="3">Set 2</th>
            <th style="display:none"></th>
        </tr>
        <tr>
            ...

Is this the case in data tables 2. that it is less forgiving than 1.10, or am I missing something?

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 64,918Questions: 1Answers: 10,751 Site admin
    Answer ✓

    The problem there is that the number of columns doesn't add up. In the first row you define 5 columns, while in the second you define 6. One is hidden, but that is irrelevant to the structure of the header.

    I think that DataTables is correct to throw an error on that.

    I had expected it to be considered invalid HTML, but interestingly the W3C checker only gives a warning:

    For me, DataTables current behaviour is correct in this regard. Add the extra column in the header to make the structure sound. That it worked in 1.x is a fluke! It certainly wasn't designed that way.

    Allan

  • NoBullManNoBullMan Posts: 95Questions: 28Answers: 2

    Thank you for clarification Allan.

Sign In or Register to comment.