Question

我不是一个真正的Javascript程序员，所以我正在努力解决这个问题！我正在使用tablesorter插件和Tablegroup插件，它非常适合用父组对表行进行分组，然后对父进行排序。

我的问题是，我还希望子组行在父组中排序

我已经尽力让这个工作，但我担心我已经碰壁了。任何人都可以为10推荐一个新的启动器吗？

以下示例工作正常 - 此处有2x组：

Nordics（挪威和丹麦）
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>

Answer 1

如果没有尝试这一点，看起来你只使用tablesorter，因为你的电话看起来像

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

如果您正在使用tableGroup，那么不应该有这样的调用吗？

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

在tableGroup的主页上，代码如下所示

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

JQuery tablesorter - 将分组的子标题保持在一起，但仍然排序

1 个答案: