'jQuery Tablesorter - Sort with colspan

Tablesorter and jQuery

I use http://tablesorter.com/docs/ for a project.

Information

I have merged / colspaned two column headers into one. That means one sorting of the third column is missing.

jsFiddle

http://jsfiddle.net/RqN8a/18/

Question

Can I force to add the sorting of the last column back into the merged / colspaned header?

HTML (if jsFiddle don't work)

<p>
<strong>This works</strong>
</p>

<table class="tablesorter">
<thead>
<tr>
    <th>Heading1</th>
    <th>Heading2</th>
    <th>Heading3</th>
</tr>
</thead>
<tbody>
<tr>
    <td>Data1a</td>
    <td>Data2a</td>
    <td>Data3a</td>
</tr>
    <tr>
    <td>Data1b</td>
    <td>Data2b</td>
    <td>Data3b</td>
</tr>
</tbody>
</table>

<p>
    <strong>Can this work?</strong><br>
    Another arrow should be added for sorting the "Data3" column
</p>

<table class="tablesorter">
<thead>
<tr>
    <th>Heading1</th>
    <th colspan="2">?   Heading2</th>
</tr>
</thead>
<tbody>
    <tr>
       <td>Data11</td>
       <td>Data2c</td>
       <td>Data3a</td>
    </tr>
    <tr>
        <td>Data12</td>
        <td>Data2b</td>
        <td>Data3b</td>
    </tr>
    <tr>
        <td>Data13</td>
        <td>Data2a</td>
        <td>Data3c</td>
    </tr>
</tbody>
</table>

Inline jQuery (in case jsFiddle don't work)

$(document).ready(function() { 
    $("table").tablesorter({ 
    }); 
});



Solution 1:[1]

As far as I know, there is no need to change much.

Just change your second HTML as follows to achieve your wish:-

<table class="tablesorter2">
    <thead>
        <tr>
            <th rowspan="2">Heading1</th>
            <th colspan="2">Heading 2 and 3</th>
        </tr>
        <tr>
            <th>Heading2</th>
            <th>Heading3</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Data11</td>
            <td>Data2c</td>
            <td>Data3a</td>
        </tr>
        <tr>
            <td>Data12</td>
            <td>Data2b</td>
            <td>Data3b</td>
        </tr>
        <tr>
            <td>Data13</td>
            <td>Data2a</td>
            <td>Data3c</td>
        </tr>
    </tbody>
</table>

Refer LIVE DEMO

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Siva Charan