Uncaught TypeError in tablesorter

<table class="aui aui-table-sortable">
    <thead>
        <tr>
            <th class="aui-table-column-issue-key">Issue key</th>
            <th>Name</th>
            <th>Age</th>
            
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>TEST-12</td>
            <td> </td>
            <td>Cannot sort tables</td>                      
        </tr>
      <tr><td colspan="3">one line</td></tr>
        <tr>
            <td>WIN-87</td>
            <td> </td>
            <td>Issue Page doesn't load in IE</td>
        </tr> 
        <tr>
            <td>DRINK-7</td>
            <td> </td>
            <td>Vending Machine is empty</td>
        </tr>
      <tr><td colspan="3">one line</td></tr>
    </tbody>
</table>

I was edit in codepen this example Sortable tables - AUI Documentation

This error was in chrome

Uncaught TypeError: Cannot read properties of undefined (reading 'getAttribute')
    at Object.is (tables-sortable.js:89:29)
    at a (jquery.tablesorter.js:210:67)
    at o (jquery.tablesorter.js:260:37)
    at e.setup (jquery.tablesorter.js:1086:17)
    at HTMLTableElement.<anonymous> (jquery.tablesorter.js:1020:28)
    at Function.each (jquery.js:354:19)
    at jQuery.fn.init.each (jquery.js:189:17)
    at e.construct [as tablesorter] (jquery.tablesorter.js:1009:29)
    at Ja (tables-sortable.js:31:19)
    at HTMLTableElement.<anonymous> (tables-sortable.js:98:13)

From Firefox

Uncaught TypeError: i is undefined
    is tables-sortable.js:89
    jQuery 7
    Ja tables-sortable.js:31
    setup tables-sortable.js:98
    jQuery 2
    setup tables-sortable.js:97
    jQuery 13
tables-sortable.js:89:23
    is tables-sortable.js:89
    jQuery 7
    Ja tables-sortable.js:31
    setup tables-sortable.js:98
    jQuery 2
    setup tables-sortable.js:97
    jQuery 13

How to fix it?

Hi @doszik

The provided snippet has wrongly closed <tr> in <thead>

Is it just a bug in the snippet copy here or is this the same in your real-life scenario?

Thx @GregTwardowski
Unfortunately it didn’t help

Hey @doszik,

The issue is the code that sorts the table (the specific version and setup of jQuery tablesorter) doesn’t anticpate rows spanning multiple columns. Newer versions support this, then also every sorter used needs to support it and have enough information from the consumer to be able work.

Could you please describe your use-case, what data exists in the columns? How would you expect it to be sorted? Why are there column spans?

If the spanning is purely for styling, I’m sure we can help you come-up with an appropriate CSS selector instead.

I’m writing a Confluence plugin. After inserting the test data into the plugin, I found an error in the browser console. At first I thought it was a bug in my code, but I was able to replicate this bug in codepen with an example from Confluence. So I wrote here.
In my code, I don’t utilize the class class=“aui-table-column-issue-key” in the header. The remaining data is similar. One column contains empty fields, and the last row concatenates all fields into one.

Confluence ver. 7.18.1