Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Avoid/disable some specific rows from sorting process using jQuery tablesorter.js

Tags:

I have one table which I am sorting using jquery plugin tablesorter. Here i want to avoid first row {class="avoid-sort" } to be sort when any column is selected for sorting. example:


       <thead>         <tr>             <th class="header">#</th>             <th class="header">Purchase Date</th>             <th class="header">Course Name</th>             <th class="header">Amount(in $)</th>             <th class="header">User Name</th>             <th class="header">Share</th>             <th class="header">Net Revenue [$236.41]</th>         </tr>       </thead>   <tbody>         <tr class="avoid-sort">             <th colspan="7">Total Revenue</th>             <td>236.41</td>         </tr>          <tr>                 <td>1</td>                 <td>January 3rd, 2013</td>                 <td>Tackle Certification</td>                 <td>50</td>                 <td>Khushi Jha</td>                 <td>35</td>                 <td>33.69</td>         </tr>       <tr>                 <td>2</td>                 <td>January 3rd, 2013</td>                 <td>Flag Certification</td>                 <td>100</td>                  <td>Pay</td>                 <td>70</td>                  <td>67.67</td>       </tr>                             <tr>                 <td>3</td>                 <td>January 3rd, 2013</td>                 <td>Tackle Certification</td>                 <td>50</td>                 <!--                    <td>-->                     <!--</td>-->                 <td>Pay</td>                 <td>35</td>                  <td>33.69</td>     </tr> 


tr class="avoid-sort" should not come in sorting!

Please help!!

like image 518
sanjulika Avatar asked Jan 09 '13 08:01

sanjulika


1 Answers

You have two choices:

  1. If you are using the original tablesorter, you can get this static row widget to "lock" the row in place.

  2. If you are using my fork of tablesorter, you can just add a non-sortable tbody, like this (demo):

    <table> <thead>   ... </thead>  <!-- rows within this tbody are ignored --> <tbody class="avoid-sort">   <tr>     <th colspan="7">Total Revenue</th>     <td>236.41</td>   </tr> </tbody>  <tbody>   <!-- sortable rows -->   <tr>     ...   </tr> </tbody> </table> 

    then initialize the table like this:

    $(function() {     $("table").tablesorter({      theme : 'blue',      cssInfoBlock : "avoid-sort",      widgets: [ 'zebra' ]    });   }); 
like image 173
Mottie Avatar answered Nov 14 '22 15:11

Mottie