2016-08-12 4 views
0

私は3つの列を持ち、これらの列を並べ替えるためにjQuery tablesorterを使用しています。表のコードを以下に示します。列の1つは「はい/いいえ」フィールドですが、代わりに「サムズアップ/サムズダウン」画像を表示しています。私は、「サムズアップ/サムズダウン」画像を表示しながら、「はい/いいえ」の値でソートしたい。どのように私はtablesorterを使用してこれを達成することができますか?jQuery tablesorter - images


          
  
<script type="text/javascript"> 
 
    $(function() { 
 
     $("#myTable").tablesorter(); 
 
    }); 
 
</script> 
 

 
<table id="myTable" class="tablesorter"> 
 
     <thead> 
 
      <tr> 
 
       <th>Subscription Product Name</th> 
 
       <th>Type</th> 
 
       <th>Has Fees</th> 
 
      </tr> 
 
     </thead> 
 
     <tbody> 
 
      @foreach (var categories in Model.Categories) 
 
      { 
 
       foreach (product p in categories) 
 
       { 
 
        <tr> 
 
         <td> 
 
          @p.name 
 
         </td> 
 
         <td> 
 
          @p.type 
 
         </td> 
 
         <td> 
 
          @DisplayThumbsUpDown(p.hasfees) 
 
         </td> 
 
        </tr> 
 
       } 
 
      } 
 
     </tbody> 
 
    </table> 
 
    
 
    @helper DisplayThumbsUpDown(HasFees fees) 
 
    { 
 
     switch (fees) 
 
     { 
 
      case HasFees.Yes: 
 
        <img src="/lib/images/thumbs-up.png">break; 
 
      case HasFees.No: 
 
        <img src="/lib/images/thumbs-down.png">break; 
 
      default: 
 
        <span>&mdash;</span>break; 
 
     } 
 
    }

答えて

1

<img src="/lib/images/thumbs-up.png" alt="0"> 
<img src="/lib/images/thumbs-down.png" alt="1"> 

のようなイメージタグで代替ATTRを含めると

$("#myTable").tablesorter({ 
    textExtraction:function(s){ 
     if($(s).find('img').length == 0) 
      return $(s).text(); 
     else 
      return $(s).find('img').attr('alt'); 
    } 
}); 

を使用するには、参照してください:作品https://forum.jquery.com/topic/tablesorter-sort-image

+0

おかげVijaiを、。 – degmo

関連する問題