JQuery tablesorter - Хранение сгруппированных подзаголовков вместе, но все еще отсортировано - PullRequest
1 голос
/ 29 марта 2010

Я на самом деле не программист Javascript, поэтому я борюсь с этим! Я использую плагин tablesorter вместе с плагином Tablegroup , который очень хорошо работает для группировки строк таблицы по родителям, а затем сортирует родителей.

Моя проблема в том, что я также хотел бы, чтобы дочерние строки были отсортированы в родительской группе

Я приложил все усилия, чтобы заставить это работать, но я боюсь, что ударил стену. Кто-нибудь может предложить новый стартер на 10?

Пример ниже работает нормально - здесь есть 2 группы:

  1. Северные страны (Норвегия и Дания)
  2. DACH (Германия и Австрия)

Если щелкнуть строку заголовка, группы будут отсортированы, но дочерние строки в группе не отсортированы.

<script type="text/javascript">
        $(document).ready(function () {
            $(".tablesorter")
                .tablesorter({
                // set default sort column
                sortList: [[0,0]],
                // don't sort by first column
                headers: {0: {sorter: false}}
                , onRenderHeader: function (){
                    this.wrapInner("<span></span>");
                }
                , debug: true
            })
        }); 
</script>
<table id="results-header" class="grid tablesorter table-header" cellpadding="0" cellspacing="0" border="0">
  <thead>
    <tr class="title">
      <th class="countries">&nbsp;</th>
      <th>% market share</th>
      <th>% increase in mkt share</th>
      <th>Target achieved</th>
      <th>% targets</th>
      <th>% sales inc. M-o-M</th>
      <th>% sales inc. M-o-M for country</th>
      <th>% training</th>
    </tr>
  </thead>
  <tbody>
    <tr id="Nord" class="collapsible parent parent-even collapsed">
      <td class="countries">Nordics</td>
      <td>39.5</td>
      <td>49</td>
      <td>69.8</td>
      <td>51.8</td>
      <td>43</td>
      <td>42.5</td>
      <td>38</td>
    </tr>
    <tr id="row-Norway" class="expand-child child child-Nord">
      <td class="countries">Norway</td>
      <td>6</td>
      <td>45</td>
      <td>101</td>
      <td>10</td>
      <td>20</td>
      <td>40</td>
      <td>30</td>
    </tr>
    <tr id="row-Denmark" class="expand-child child child-Nord">
      <td class="countries">Denmark</td>
      <td>10</td>
      <td>20</td>
      <td>3</td>
      <td>40</td>
      <td>50</td>
      <td>25</td>
      <td>8</td>
    </tr>
    <tr id="DACH" class="collapsible parent parent-odd collapsed">
      <td class="countries">DACH</td>
      <td>77</td>
      <td>61</td>
      <td>43</td>
      <td>98</td>
      <td>65</td>
      <td>92.5</td>
      <td>59.5</td>
    </tr>
    <tr id="row-Germany" class="expand-child child child-DACH">
      <td class="countries">Germany</td>
      <td>56</td>
      <td>24</td>
      <td>84</td>
      <td>98</td>
      <td>32</td>
      <td>87</td>
      <td>21</td>
    </tr>
    <tr id="row-Austria" class="expand-child child child-DACH">
      <td class="countries">Austria</td>
      <td>98</td>
      <td>98</td>
      <td>2</td>
      <td>98</td>
      <td>98</td>
      <td>98</td>
      <td>98</td>
    </tr>
  </tbody>
</table>

1 Ответ

0 голосов
/ 29 марта 2010

Без этого похоже, что вы используете только сортировщик таблиц, так как ваш вызов выглядит как

$(".tablesorter").tablesorter({...})

Если вы используете tableGroup, разве не должно быть таких звонков, как этот?

$(...).tableGroup({...})

На домашней странице tableGroup код выглядит следующим образом

$('table').tableSorter({...}).sortStop(function (e, col) {
    $(this).tableUnGroup();
    ...
        $(this).tableGroup({...});
    ...
});
...