table sorter with combined two rows

Question

jQuery table sorter with combined rows

Every second row contains detail data for the first row. By default, it is hidden with CSS, but I can slide it open with jQuery.

What I would like to achieve: Table sorting similar to this jQuery plugin: http://tablesorter.com/docs/

The problem: The plugin should "glue together" all pair rows, and move them together. The sorting should be done only with the data of the first row (.row-vm), while ignoring the content of the second row (.row-details).

Is there a jQuery plugin that supports this?

<tr class="row-vm">
    <td>...</td>
    <td>...</td>
...
</tr>
<tr class="row-details">
    <td colspan="6">
       Description data
    </td>
</tr>
<tr class="row-vm">
    <td>...</td>
    <td>...</td>
...
</tr>
<tr class="row-details">
    <td colspan="6">
       Description data
    </td>
</tr>

Answer 1

So i'm not sure how well documented this was but i found what i think you are looking for in the table object.

Check out this fiddle

It looks like you can add a class of expand-child. Or you can pass in your own class name

$("table").tablesorter({
    cssChildRow: "row-details"
});