我有一个表填充了数据库中的数据。由于jQuery tablesorter,这个表是可排序的。我的问题是主表的一个单元格包含另外两个表。所以主表上的排序不再起作用了。如何仅在主表上强制排序?
这是从我的数据库中恢复另一个表后的表格源代码示例:
<table id='users' class='tablesorter' width='100%' border='0'>
<thead> ... </thead>
<tbody>
<tr class="even">
<td> ... </td>
<td> ... </td>
<td>
<table border="0" cellpadding="0" cellsapcing="0" width="907"
<tbody>
<tr class="even"> ... </tr>
<tr class="even"> ... </tr>
<tr class="even"> ... </tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellsapcing="0" width="907"
<tbody>
<tr class="even"> ... </tr>
<tr class="even"> ... </tr>
<tr class="even"> ... </tr>
</tbody>
</table>
</td>
...
</tr>
</tbody>
</table>
我的javascript:
$("#users").tablesorter({
headers: {
0: {
sorter: false
},
4: {
sorter: false
},
5: {
sorter: false
},
6: {
sorter: false
},
7: {
sorter: false
},
9: {
sorter: false
},
10: {
sorter: false
},
11: {
sorter: false
},
12: {
sorter: false
},
13: {
sorter: false
},
14: {
sorter: false
},
15: {
sorter: false
}
}
}).bind("sortEnd",function() {
$(this).find('tbody tr:odd').removeClass('odd even').addClass('odd');
$(this).find('tbody tr:even').removeClass('odd even').addClass('even');
}).trigger("sortEnd");
我的css:
.tablesorter tbody tr:nth-child(odd) {
background-color: white;
}
.tablesorter tbody tr:nth-child(even) {
background-color: lightgrey;
}
答案 0 :(得分:1)
这听起来像tablesorter的原始版本存在的问题。嵌套表未正确隔离(demo)。
查看我的fork of tablesorter,它确实特别关注嵌套表格。这是a demo。
$(function () {
$('#main').tablesorter({
theme: 'blue',
widgets: ['zebra']
});
});