将jQuery Tablesorter与Column Spans一起使用

时间:2012-10-16 17:16:43

标签: jquery html-table tablesorter

我使用jQuery tablesorter插件对包含14列的表进行排序。但是,每隔一段时间我就需要插入一个跨越所有14列的行。但这似乎打破了排序功能(只有第一列排序,所有其他排序都被打破)。

JavaScript错误说jquery.tablesorter.js在此返回语句中失败:

function getCachedSortType(parsers,i) {
    return parsers[i].type;
};

有谁知道如何让排序忽略一行?

这是我当前的代码(我不是为了简化事情而排序前两列):

$("#myTableId").tablesorter({
    textExtraction: function(node){
        var cellValue = $(node).html();
        return (cellValue == null ? "" : cellValue);
    },
    headers: {
        0: {sorter:'text'},
        1: {sorter:'text'},
        2: {sorter: false},
        3: {sorter: false},
        4: {sorter: false},
        5: {sorter: false},
        6: {sorter: false},
        7: {sorter: false},
        8: {sorter: false},
        9: {sorter: false},
        10: {sorter: false},
        11: {sorter: false},
        12: {sorter: false},
        13: {sorter: false}
    }
});

2 个答案:

答案 0 :(得分:3)

插件有一个插件:

https://github.com/ascii-soup/Tablesorter-Static-Row-Plugin

另一种方法是使用tablesorter插件中的sortStartsortEnd绑定,您可以在排序之前删除列跨越行的函数,以及在排序之后将其添加回来的函数。上面的插件不适用于跨越所有列的行,因此需要两者的组合。

这是一种方法 - 临时删除colspan并在排序之前添加列并在排序后撤消更改(假设跨越所有列的行具有类fullSpan):

$("#myTableId").bind("sortStart",function() { 
        var colCount = getColCount();
        $('tbody .fullSpan').each(function() {
            $(this).removeAttr('colspan');
            for (var i= 0; i < colCount; i++) {
                 $(this).append('<td class="temptd"></td>');
            }
        }); 
}).bind("sortEnd",function() { 
        var colCount = getColCount();
        $('.temptd').remove();
        $('tbody .fullSpan').each(function() {
                 $(this).attr('colspan', colCount);
        });
}); 

如果需要,可以将其与静态行插件结合使用(添加小部件和static类)。

看看这个jsfiddle:http://jsfiddle.net/DrZgM/20/

P.S。静态行插件有一个最新的JQuery的错误 - 已嵌入上面的JSfiddle。

答案 1 :(得分:0)

此问题已在2.3或更高版本中修复。 看看this description