Jquery tablesorter plugin: trying to sort 2 index same time

Question

i would like to know if it s possible to get sort for 2 index with tablesorter jquery's plugin.

My table is build as it:

<table id="myTable">
<thead>
    <tr>
        <th align="left" width="40%">Nom fichier</th>
        <th align="left">UO</th>
        <th align="left">Nb pages</th>
        <th align="left">D&eacute;lai&nbsp;</th>
        <th align="left">Etat</th>
        <th>Imprimer</th>
</thead>
<tbody>
    <tr class="sectiontableentry2">
        <td valign="top" align="left" class="">
            <a href="#r1544790" id="r1544790">DI.DISLOT06.060312.103648.TE.MR510</a>
        </td>
        <td valign="top">ImpRV - Autres impressions recto-verso</td>
        <td valign="top">1645.00</td>
        <td valign="top" class="alertred">15/03/2012</td>
        <td valign="top">Transfert Fichier vers PRISMA</td>
        <td>imprimer</td>
    </tr>
    <tr style="display:none" id="1544790">
        <td colspan="6" width="100%">
            <table width="100%" cellpadding="0" cellspacing="0"  class="det_suivi" style="display:block;text-align:left;">
                <tr>
                    <td colspan="3"><h4 style="text-align:left;">DI.DISLOT06.060312.103648.TE.MR510</h4></td>
                </tr>
                <tr>
                    <th>Log</th>
                    <th>Date heure</th>
                    <th>Etat</th>
                </tr>
                <tr class="sectiontableentry1">
                    <td align="left">1 - reception + demande uo</td>
                    <td align="left">06/03/2012 10:35:00</td>
                    <td align="left">Bon �  produire</td>
                </tr>
                <tr class="sectiontableentry0">
                    <td align="left">2 - Transfert Fichier vers PRISMA</td>
                    <td align="left">06/03/2012 10:35:04</td>
                    <td align="left"></td>
                </tr>
            </table>
        </td>
    </tr>



    <tr class="sectiontableentry2">
        <td valign="top" align="left" class="">
            <a href="#r1544790" id="r1544991">DI.DISLOT06.060312.103648.TE.MR769</a>
        </td>
        <td valign="top">ImpRV - Autres impressions recto-verso</td>
        <td valign="top">1645.00</td>
        <td valign="top" class="alertred">23/03/2012</td>
        <td valign="top">Transfert Fichier vers PRISMA</td>
        <td>imprimer</td>
    </tr>
    <tr style="display:none" id="1544991">
        <td colspan="6" width="100%">
            <table width="100%" cellpadding="0" cellspacing="0"  class="det_suivi" style="display:block;text-align:left;">
                <tr>
                    <td colspan="3"><h4 style="text-align:left;">DI.DISLOT06.060312.103648.TE.MR769</h4></td>
                </tr>
                <tr>
                    <th>Log</th>
                    <th>Date heure</th>
                    <th>Etat</th>
                </tr>
                <tr class="sectiontableentry1">
                    <td align="left">1 - reception + demande uo</td>
                    <td align="left">06/03/2012 10:35:00</td>
                    <td align="left">Bon �  produire</td>
                </tr>
                <tr class="sectiontableentry0">
                    <td align="left">2 - Transfert Fichier vers PRISMA</td>
                    <td align="left">06/03/2012 10:35:04</td>
                    <td align="left"></td>
                </tr>
            </table>
        </td>
    </tr>


    <tr class="sectiontableentry2">
        <td valign="top" align="left" class="">
            <a href="#r1544790" id="r1544791">DI.DISLOT06.060312.103648.TE.MR999</a>
        </td>
        <td valign="top">ImpRV - Autres impressions recto-verso</td>
        <td valign="top">1645.00</td>
        <td valign="top" class="alertred">05/03/2012</td>
        <td valign="top">Transfert Fichier vers PRISMA</td>
        <td>imprimer</td>
    </tr>
    <tr style="display:none" id="1544791">
        <td colspan="6" width="100%">
            <table width="100%" cellpadding="0" cellspacing="0"  class="det_suivi" style="display:block;text-align:left;">
                <tr>
                    <td colspan="3"><h4 style="text-align:left;">DI.DISLOT06.060312.103648.TE.MR999</h4></td>
                </tr>
                <tr>
                    <th>Log</th>
                    <th>Date heure</th>
                    <th>Etat</th>
                </tr>
                <tr class="sectiontableentry1">
                    <td align="left">1 - reception + demande uo</td>
                    <td align="left">06/03/2012 10:35:00</td>
                    <td align="left">Bon �  produire</td>
                </tr>
                <tr class="sectiontableentry0">
                    <td align="left">2 - Transfert Fichier vers PRISMA</td>
                    <td align="left">06/03/2012 10:35:04</td>
                    <td align="left"></td>
                </tr>
            </table>
        </td>
    </tr>
 </tbody>
</table>

I use the default configuration.

My problem is the

style="display:none"

in the table: this is the detail view content of the row

1st inde: normal 2nd index: detail of the 1st one 3nd index: normal 4th index: detail of the 3nd ...

Default sort on date for example will put the 1st, 3nd, 5th index together on top and the rest at bottom.

So i would like to try to sort by grouping the 1st with 2nd index ...

How could i do ?

ty :)

score 0 · Accepted Answer · edited May 23 '17 at 11:56

If I understand what you are asking, I think you just need to add the child-row class name to the hidden table rows. Here is the original demo which has a link to download it, but don't download it because it was merged into tablesorter version 2.0.5, it just wasn't documented.

So, basically all you need to do is add the "expand-child" class to the hidden rows.

$('table').tablesorter({
  cssChildRow: "expand-child" // default setting
});

HTML

<tr class="expand-child" style="display:none" id="1544790">
...
</tr>

**NOTE*: It is not recommended to have an element ID that starts with a number, so instead of id="1544790" add any letter to the beginning: id="n1544790" (ref).

is that i was looking for ... many thanks ;). Ty for the tip on ID, i will apply ;). — Yeurl, Mar 27 '12 at 08:23

Jquery tablesorter plugin: trying to sort 2 index same time

1 Answers1