2017-12-04 3 views
1

동적으로 테이블을 사용하고 테이블 정렬기 호출기가 잘 작동하지만 일부 열을 필터링하려고하면 페이지 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 

      }); 
     }); 

답변

0

ajaxUrl 옵션에는 필터 값이 포함되어야합니다. 당신이 documentation의 예를 보면,이 나타납니다 :

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

{filterList:fcol}는 서버 요청에 필터를 추가합니다.

내장 된 구현이 작동하지 않는 경우 customAjaxUrl callback을 사용하여 ajax URL을 수정하십시오.

+0

감사합니다. 나는 어제 그것을 발견하고 잘 작동하지만 지금은 정렬하는 방법에 문제가 있습니다. 정렬하는 방법을 알고 있지만 열이 클릭된다는 것을 모릅니다. 내가 내 테이블에있는 모든 열을 클릭했을 때 같은 반응을 보였습니다 HTML에서 diff 열은 있지만 customAjaxUrl은 diff 논리를 만들었습니다 : URL의 이름을 얻기 전에 url을 반환하면 어떤 조언을 해줄 수 있습니까? –

+0

'ajaxUrl' 안에는 열리스트와 정렬 방향을 서버에 전달하는'{sortList : col} '도있다. – Mottie

관련 문제