25

jqueryプラグインtablesorterを使用して並べ替えているテーブルが1つあります。ここでは、並べ替えのために任意の列が選択されたときに、最初の行{class="avoid-sort"}が並べ替えられるのを避けたいと思います。例:


       <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"はソートに含まれるべきではありません!

助けてください!!

4

3 に答える 3

36

2つの選択肢があります。

  1. 元のテーブルソーターを使用している場合は、この静的行ウィジェットを取得して、行を所定の位置に「ロック」することができます。

  2. テーブルソーターの私のフォークを使用している場合は、次のように、ソートできないtbodyを追加できます(デモ)。

    <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>
    

    次に、次のようにテーブルを初期化します。

    $(function() { 
    
      $("table").tablesorter({ 
        theme : 'blue', 
        cssInfoBlock : "avoid-sort", 
        widgets: [ 'zebra' ] 
      }); 
    
    });
    
于 2013-01-10T06:18:14.633 に答える
2

Mottieのフォークには、staticRowプラグインが組み込まれています。

<script src="/js/tablesorter/jquery.tablesorter.min.js"></script>
<script src="/js/tablesorter/widgets/widget-staticRow.min.js"></script>
<!-- … -->
<tr class="static">…&lt;/tr>
$("table").tablesorter({
    widgets: ['staticRow']
})

または、カスタムクラス名を設定することもできます。

<tr class="tablesorter-static">…&lt;/tr>
$("table").tablesorter({
    widgets: ['staticRow'],
    widgetOptions: {
        // Note it expects a CSS selector, not a raw class name
        staticRow_class: ".tablesorter-static"
    }
})
于 2018-02-08T09:03:40.027 に答える
-3
$(function() {     
$("#myTable").tablesorter({
        headers: {4: {sorter: false},8: {sorter: false}}
    });
});

ここで4、8は列番号です。列は0で始まります

于 2016-11-15T12:24:33.600 に答える