テーブルソーターの並べ替えとフィルタリングが機能しませんでした

Question

私は動的にテーブルを持っていますが、テーブルソーターポケベルはうまくいきますが、いくつかのカラムをフィルタリングしようとすると、ページ0に戻ります。どこかで私はthと他の奇妙なことをクリックしてソートしようとすると、私はテーブルソーターで入力ボックスのデバッグモードを入力すると言うが大丈夫です。

 var $table = $(".track-grid table.tablesorter"); 
     var pagesize = $('.pagesize').val(); 
     $table.tablesorter({ 
      widthFixed: true, 
      cssChildRow: 'infoRow', 
      widgets: ['filter'], 
      debug: true, 
      widgetOptions: { 

       filter_hideFilters: true, 
       // 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_ignoreCase:false 

      } 

     }); 

     $table.on('filterInit', function() { 
      $table.tablesorterPager({ 
       container: $(".pager"), 
       ajaxUrl: `track/getEvents?page={page}&size={size}&totalCount=` + totalCount, 

       customAjaxUrl: function (table, url) { 
        return url; 
       }, 
       ajaxProcessing: function (data) { 

        $('.tablesorter tbody').html(data.result.eventsHtml); 

        $('#trackOverlay').hide(); 
        return [parseInt(data.result.totalEventsCount)]; 
       }, 
       page: 0, 
       processAjaxOnInit: true, 
       output: '{startRow} - {endRow}/{filteredRows} ({totalRows})', 
       updateArrows: true, 
       fixedHeight: false, 
       removeRows: false, 
       savePages: false, 
       cssNext: '.next', // next page arrow 
       cssPrev: '.prev', // previous page arrow 
       cssFirst: '.first', // go to first page arrow 
       cssLast: '.last', // go to last page arrow 
       cssGoto: '.gotoPage', // page select dropdown - select dropdown that set the "page" option 

       cssPageDisplay: '.pagedisplay', // location of where the "output" is displayed 
       cssPageSize: '.pagesize', // page size selector - select dropdown that sets the "size" option 
       cssDisabled: 'disabled', // Note there is no period "." in front of this class name 
       cssErrorRow: 'tablesorter-errorRow' // error information row 

      }); 
     }); 

Answer 1

ajaxUrlオプションにフィルタ値を含める必要があります。あなたはdocumentationの例を見れば、あなたはこれを参照してくださいよ：

ajaxUrl: "http://mydatabase.com?page={page}&size={size}&{sortList:col}&{filterList:fcol}", 

{filterList:fcol}は、サーバ要求にフィルタを追加します。

組み込みの実装が機能しない場合は、customAjaxUrl callbackを使用してajaxのURLを変更してください。