Combined two row table sorter

Question

jQuery table sorter with combo strings

Each second row contains details for the first row. By default, it is hidden using CSS, but I can open it using jQuery.

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

Problem: The plugin must “glue” all pairs of lines and move them together. Sorting should be performed only with the data of the first row (.row-vm), ignoring the contents 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

I use datatables, look and see if it helps you

Examples: http://datatables.net/examples/

Answer 2

So I'm not sure how well documented this is, but I found what I think you are looking for in a table object.

Mark this fiddle

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

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

Answer 3

We have the same problem and found a workaround. I pass the class name that I set in the second line. Just add one of the following codes:

 $(document).ready(function() { $("tableName/ID/classname").tablesorter({ cssChildRow: "tableName/ID/classname" }); } ); 

or

 $("tableName/ID/classname").tablesorter({ cssChildRow: "tableName/ID/classname" });