tablesorter

Question

http://jsfiddle.net/9sKwJ/66/

tr.spacer { height: 40px; } 

$.tablesorter.addWidget({ 
    id: 'spacer', 
    format: function(table) { 
     var c = table.config, 
     $t = $(table), 
     $r = $t.find('tbody').find('tr'), 
     i, l, last, col, rows, spacers = []; 
     if (c.sortList && c.sortList[0]) { 
      $t.find('tr.spacer').removeClass('spacer'); 
      col = c.sortList[0][0]; // first sorted column 
      rows = table.config.cache.normalized; 
      last = rows[0][col]; // text from first row 
      l = rows.length; 
      for (i=0; i < l; i++) { 
       // if text from row doesn't match last row, 
       // save it to add a spacer 
       if (rows[i][col] !== last) { 
        spacers.push(i-1); 
        last = rows[i][col]; 
       } 
      } 
      // add spacer class to the appropriate rows 
      for (i=0; i<spacers.length; i++){ 
       $r.eq(spacers[i]).addClass('spacer'); 
      } 
     } 
    } 
}); 


$('table').tablesorter({ 
    widgets : ['spacer'] 
}); 

<table id="test"> 
    <thead> 
    <tr> 
     <th>Name</th> 
     <th>Number</th> 
     <th>Another Example</th> 
    </tr> 
    </thead> 
<tbody> 

    <tr> 
    <td>Test4</td> 
    <td>4</td> 
    <td>Hello4</td> 
    </tr>   

    <tr> 
    <td colspan="3">Test4</td> 
    </tr> 

    <tr> 
    <td>Test3</td> 
    <td>3</td> 
    <td>Hello3</td> 
    </tr>   

    <tr> 
    <td colspan="3">Test3</td> 
    </tr> 

    <tr> 
    <td>Test2</td> 
    <td>2</td> 
    <td>Hello2</td> 
    </tr>   

    <tr> 
    <td colspan="3">Test2</td> 
    </tr> 

    <tr> 
    <td>Test1</td> 
    <td>1</td> 
    <td>Hello1</td> 
    </tr>   

    <tr> 
    <td colspan="3">Test1</td> 
    </tr> 
</tbody> 
</table> 

यह सिर्फ तरह से मैं यह चाहता हूँ अगर आप इसे पहले कॉलम के आधार पर सॉर्ट सॉर्ट करता वाली पंक्तियों की जोड़े छंटाई, लेकिन अन्य दो कॉलम डॉन मैं वही जोड़ा 'tr' प्रकार को बनाए रखने के लिए देख रहा हूँ।

इस पर कोई मदद?

Answer 1

प्रत्येक दोहराया पंक्ति पर expand-child वर्ग के नाम का उपयोग करें:

<tr> 
    <td>Test3</td> 
    <td>3</td> 
    <td>Hello3</td> 
</tr>   

<tr class="expand-child"> 
    <td colspan="3">Test3</td> 
</tr> 

यह cssChildRow विकल्प द्वारा परिभाषित है:

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

यहाँ कार्रवाई में इसके बारे में a demo है।