jquery tablesorter插件的使用

1、引入两个js文件

jquery-2.1.1.min.js

jquery.tablesorter.js

2、在js写上 $(“#表id”).tablesorter();即可将表的所有字段进行排序



假设我不需要点击“序号”进行排序，使用如下方法：

$.tablesorter.defaults.headers = {0: {sorter: false}};

同理假设我不需要点击“序号”和“组别”进行排序，使用如下方法：

$.tablesorter.defaults.headers = {0: {sorter: false},1: {sorter: false}};

3、


在这，我点击不同的不同的按钮，譬如，最开始在“组”这一栏，但是当我点击“小区”时，需要的只是小区的内容，而事实上它把组的内容也加载进来了，也就是没有对之前的内容进行清除，用一下代码可解决：

$("#表id").trigger("update");

如用了以上代码排序还是有问题，那需要看下你自己的代码，譬如本人在这用了以上代码排序还是出问题了，源码如下：

success: function (result) {
if(result.success){
var listDeclaration = result.data;
var str = "<tbody>";
for(var index in listDeclaration){
str +=  "<tr>"+
"<td>"+(parseInt(index)+1)+"</td>"+
"<td>"+listDeclaration[index].orgName+"</td>"+
"<td>"+listDeclaration[index].totalOrderNum+"</td>"+
"<td>"+listDeclaration[index].totalOrderAmount+"</td>"+
"</tr>";
}
str += "</tbody>";
$("#statisticsTab").append(str);
}else{
}

也就是每次点“组”“小区”“大区”“运营”的时候都会重新加载数据，

$("#表id").trigger("update");

代码把我当前table里面的tr里的内容去掉了，但并没有把我的tbody去掉，所以你需要每次加载内容前把tbody remove（）掉。（当然tr里的内容你也可以不用$(“#表id”).trigger(“update”);自己写行代码也是能够清除的）

4、进行排序的时候，“序号”这一列是不需要变动的，始终需要它是1234……这样的序列，看了一遍jquery.tablesorter.js没找到相应的方法解决这个问题，就自己写了一个，js代码如下：

function setIndex(){
var index = 0
$('#statisticsTab tr').find('td:first').each(function () {
if ($(this).index() == 0) { // 如果当前是第一列
$(this).text(++index)
}
});
}

在jquery.tablesorter.js文件中的 function appendToTable(table,cache)方法中的最后调用setIndex();：

// trigger sortend
setTimeout(function() {
setIndex();
$(table).trigger("sortEnd");

},0);

以上这样就相当于每次它排序完，又把序号列重新按序列赋值了一遍。

注：因为在这进行排序的时候不是重新从数据库里面读出来的，所以这样操作，如果从数据库读出来的话其实直接取的时候在sql上进行order by就行了。

转载请注明原址：http://blog.csdn.net/zheng911209/article/details/47020501