tablesorter 사용자 정의 디스플레이 그룹 헤더

Question

먼저 TableSorter 2.11.1 및 jquery 1.9.1을 사용하고 있습니다. 내가 날짜로 내 테이블을 정렬하고 난

내가 원하는 것은이 이미지처럼 주하여 그룹화하고 (http://mottie.github.io/tablesorter/docs/example-widget-grouping.html)

내가 그룹이 데모를 사용하여 내 행 전체를 추가하는 것입니다 그룹 바에있는주의 가격의. 일주일에 행의 수처럼.

나는 위젯-grouping.js에서 검색하고 내가 할 수있는 방법을 찾을 수 있도록 내가 JQuery와에 전문가가 아니에요 주

$tr = c.$table.find('tr.group-header').bind('selectstart', false); 
     if (wo.group_count) { 
      $tr.each(function(){ 
       $(this).find('.group-count').html(wo.group_count.replace(/\{num\}/g, $(this).nextUntil('tr.group-header').filter(':visible').length)); 
      }); 
     } 

의 행의 수를 계산하는 코드를 찾을 수 가격을 받고 그룹 머리글에 추가하십시오.

Answer 1

사실 내 질문에 그룹화 위젯에이 기능이 없다는 것을 알게되었습니다. 그래서 나는 버전 2.12.0 (새 grouping widget demo)에 두 가지 새로운 옵션을 추가 :

• group_callback - 이벤트 이름 그룹화 위젯 후 테이블에 트리거 - 당신이
• group_complete는
그룹 머리글 텍스트를 수정할 수있는 기능 완료되었습니다. 하나 이상의 열을 대상으로해야하는 경우 다음 대신 column === targetColumn의 targetColumn.indexOf(column) >= 0를 사용하여 배열로 targetColumn을 변경할 수 있습니다

var total = 0, 
    targetColumn = 1, 
    $table = $('table'); 

$table.on('groupingComplete', function(){ 
    // don't include the group header rows 
    $table.find('tbody tr:not(.group-header)').each(function(){ 
     total += parseFloat($(this).find('td').eq(targetColumn).text()); 
    }); 
    $table.find('.group-header .total').html(total); 
}); 

$table.tablesorter({ 
    theme: 'blue', 
    widthFixed: true, 
    widgets: ['group'], 
    widgetOptions: { 
     // text added to the group header - {num} is the number of rows in that group 
     group_count: ' ({num})', 

     // add a group subtotal to the "Numeric" column 
     group_callback: function ($cell, $rows, column, table) { 
      // callback allowing modification of the group header labels 
      // $cell = current table cell (containing group header cells '.group-name' & '.group-count' 
      // $rows = all of the table rows for the current group; table = current table (DOM) 
      // column = current column being sorted/grouped 
      if (column === targetColumn) { 
       var t, subtotal = 0; 
       $rows.each(function() { 
        subtotal += parseInt($(this).find('td').eq(column).text()); 
       }); 
       t = '; <span class="subtotal">' + subtotal + 
        '</span>/<span class="total"></span>'; 
       $cell.find('.group-count').append(t); 
      } 
     } 

    } 
}); 

:

그래서 지금 당신은이 같은 (demo)를 할 수 있습니다.