2015-06-12 277 views
1

我使用tablesorter對列進行排序。日期列的錯誤列過濾

但我發現了以下問題:

enter image description here

正如你可以看到第二行沒有16

此表也有外部搜索字段和搜索結果等於1,如果我輸入16,因此第二行不顯示。

但它像一個表格錯誤。

HTML源代碼:

<table id="table" class="tablesorter sortable tablesorter-blue hasFilters" role="grid" aria-describedby="table_pager_info"><colgroup class="tablesorter-colgroup"><col style="width: 5.2%;"><col style="width: 14.4%;"><col style="width: 14.4%;"><col style="width: 14.1%;"><col style="width: 12.5%;"><col style="width: 10.7%;"><col style="width: 13.1%;"><col style="width: 8.7%;"></colgroup> 
        <thead> 
        <tr role="row" class="tablesorter-headerRow"> 
          .... 
        </tr> 
        <tr role="row" class="tablesorter-filter-row tablesorter-ignoreRow"><td><input type="search" placeholder="" class="tablesorter-filter disabled" data-column="0" disabled="" data-lastsearchtime="1434125033081"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="1" data-lastsearchtime="1434125097454"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="2" data-lastsearchtime="1434125046223"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="3" data-lastsearchtime="1434125033081"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="4" data-lastsearchtime="1434125033081"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="5" data-lastsearchtime="1434125033081"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="6" data-lastsearchtime="1434125033081"></td><td><input type="search" placeholder="Искать..." class="tablesorter-filter" data-column="7" data-lastsearchtime="1434125033081"></td></tr></thead> 
        <tbody aria-live="polite" aria-relevant="all">      
        <tr class="blue odd" role="row"> 
          <td class=""> 
           <a href="currentCompany/campaignDetails/350">1</a> 

           <div class="line"> 

           </div> 
          </td> 
          <td class="startDate">16.06.2015 19:01</td> 
          <td class="">17.06.2015 19:04</td> 
          <td class="">1</td> 
          <td class="">1,44</td> 
          <td class="" id="stateDiv350">Создана</td> 
          <td class="">IN_PROGRESS 

          </td> 
          <td class=""> 
           ... 
          </td> 
         </tr><tr class="blue even" role="row"> 
          <td class=""> 
           <a href="currentCompany/campaignDetails/351">2</a> 

           <div class="line"> 

           </div> 
          </td> 
          <td class="startDate">13.06.2015 21:03</td> 
          <td class="">15.06.2015 19:01</td> 
          <td class="">1</td> 
          <td class="">2,70</td> 
          <td class="" id="stateDiv351">Создана</td> 
          <td class="">IN_PROGRESS 

          </td> 
          <td class=""> 
           ... 
          </td> 
         </tr></tbody> 
       </table> 

臺分揀機的配置:

$(function() { 
     var $table = $('#table') 
      .tablesorter({ 
       headers: { 0: { filter: false} }, 
       sortList: [[1,1]], // sorting(desc) by column with index 1 
       dateFormat:'ddmmyyyy', 
       theme: 'blue', 
       widthFixed: true, 
       headerTemplate: '{content} {icon}', 
       widgets: ['zebra', 'filter'], 
       widgetOptions: { 
        zebra: ["even", "odd"], 
        // filter_anyMatch replaced! Instead use the filter_external option 
        // Set to use a jQuery selector (or jQuery object) pointing to the 
        // external filter (column specific or any match) 
        filter_external: '.search', 
        // add a default type search to the first name column 
        filter_defaultFilter: {1: '~{query}'}, 
        // include column filters 
        filter_columnFilters: true, 
        filter_placeholder: {search: 'Искать...'}, 
        filter_saveFilters: true, 
        filter_reset: '.reset' 
       } 
      }) 
      // needed for pager plugin to know when to calculate filtered rows/pages 
      .addClass('hasFilters') 
      .tablesorterPager({ 
       container: $(".table-pager"), 
       output: '{page} из {filteredPages} ({filteredRows})', 
       size: 5 
      }); 
    }); 

是否有可能解決這個問題?

+0

嗨,嗯,不太確定什麼是錯誤,因爲當我嘗試它在我的本地電腦上工作。你可以檢查開發者控制檯,看看是否有錯誤。更好的是,你能爲這個錯誤創建一個小提琴嗎? –

回答

1

您所看到的兩件事情發生在這裏:

  1. 當過濾器是不是有效日期輸入數字,字符串比較完成。所以這就是第一行匹配的原因。
  2. 因爲列1的filter_defaultFilter設置爲使用一個模糊搜索

    filter_defaultFilter: {1: '~{query}'} 
    

    模糊搜索字符串值「2015年6月13日21時03分」的看到了「1」之後是「6」 (這就是模糊搜索的工作原理),所以這一行也是可見的。

我會建議刪除默認的模糊搜索(demo)。