更新tablesorter列

Question

我在jquery.tablesorter插件中添加了一个解析器，它正确运行并返回结果（参见下面的代码），但表中没有使用解析结果进行更新。我有一个缺失的步骤吗？我首先加载页面并在标题上排序时尝试使用它：

//这是我的添加解析器javascript文件

$.tablesorter.addParser({
    id: "currencyformat",
    is: function () {
        // does it start with a dollar sign
        return false;
    },
    format: function (s, table, cell) {
                var text = s;
                if (text.charAt(0) === '$') {
                    var currency = text.split("$");
                    var result = currencyFormat(parseFloat(currency[1]));
                    return result;  // result looks like "$42.00" without extra zeros
                } else { 
                    return text;
                }
    },
    //parsed: true, // filter widget flag 
    type: "text"  // also tried text and numeric
});

在我的javascript代码中设置如下：

$('#testtable').tablesorter({
    headers: {
        3: { sorter: 'currencyformat' }, // column # 4
        4: { sorter: 'currencyformat' }, // column # 5
    },
    sortList: [[4, 1]]
});

我的表看起来像这样： ...     范围ID类型money1 money1     abc 1 alphabet $ 44.0000 $ 491.87000
    jkl 2 alphabet $ 42.0000 $ 12.00000
    xyz 3 alphabet $ 45.5000 $ 23.39000

Answer 1

Tablesorter有一个内置的货币解析器，所以你需要做的就是初始化插件（demo）：

$(function () {
    $('table').tablesorter({
        theme: 'blue',
        sortList: [[1, 1]]
    });
});

---

更新：试试这个“modColumn”小部件（demo）：

它通过删除tbody，修改它的内容然后将其添加回来优化修改表的内容。希望功能示例足够简单，不需要太多解释：

$(function () {
    $('table').tablesorter({
        theme: 'blue',
        widgets: ['zebra', 'modColumn'],
        widgetOptions: {
            modColumn : {
                1 : function( table, $cell, html ){
                    return '$ ' + html + ' USD';
                }
            }
        }
    });
});

var modColumn = function(table, c, wo){
    var k, i, $bk, $tb, $cell, n, totalRows, col,
        b = table.tBodies,
        cols = c.columns,
        modColumn = wo.modColumn;
    // if nothing is set, return quickly
    if ($.isEmptyObject(modColumn)) { return; }
    for (k = 0; k < b.length; k++) {
        $bk = $(b[k]);
        if ($bk.length && !$bk.hasClass(c.cssInfoBlock)) {
            $tb = $.tablesorter.processTbody(table, $bk, true);
            n = c.cache[k].normalized;
            totalRows = n.length;
            for (i = 0; i < totalRows; i++) {
                for (col in modColumn) {
                    if ($.isFunction(modColumn[col])) {
                        n[i][cols].$row.children().eq(col).html(function(i, h){
                            // put original value into data-text attribute for updates
                            var $t = $(this),
                                orig = $t.attr(c.textAttribute) || '';
                            if (orig === '') {
                                $t.attr(c.textAttribute, h);
                                orig = h;
                            }
                            return modColumn[col]( table, $(this), orig );
                        });
                    }
                }
            }
            $.tablesorter.processTbody(table, $tb, false);
        }
    }
};

$.tablesorter.addWidget({
    id: "modColumn",
    options: {
        modColumn : {}
    },
    init: function(table, thisWidget, c, wo) {
        c.$table
            .off('.modColumn')
            .on('update updateRows updateAll addRows '.split(' ').join('.modColumn '), function(){
                modColumn(table, c, wo);
            });
        modColumn(table, c, wo);
    }
});