Question

TableSorter是一个很棒的jquery脚本，用于对具有许多选项的html表进行排序。

但我不知道如何添加一个简单的'导出到csv'按钮（或链接）来获取包含我的表记录的文件（没有特殊格式）。

我知道输出插件但对我来说似乎太复杂了。

先谢谢你的帮助！

泰德

Answer 1

它实际上并不复杂，因为所有的选择，它看起来只是令人生畏。 output widget可以输出csv，tsv，任何其他分隔（空格，分号等）值，javascript数组或JSON。

如果您只是使用基本功能，默认设置将为：

将csv输出到弹出窗口
仅包含最后一个标题行
仅包含已过滤的行（如果过滤器窗口小部件甚至未被使用，则所有行都会显示）
仅输出表格单元格文本（忽略HTML）

您需要的只是此代码（demo）：

HTML

<button class="download">Get CSV</button>
<table class="tablesorter">
    ....
</table>

脚本

$(function () {
    var $table = $('table');

    $('.download').click(function(){
        $table.trigger('outputTable');
    });

    $table.tablesorter({
        theme: 'blue',
        widgets: ['zebra', 'output']
    });
});

我创建了another demo，显示了所有选项，带有一组单选按钮，允许用户在将输出发送到弹出窗口或下载文件之间进行选择。

HTML

<label><input data-delivery="p" name="delivery" type="radio" checked /> popup</label>
<label><input data-delivery="d" name="delivery" type="radio" /> download</label>
<button class="download">Get CSV</button>

脚本

var $table = $('table');

$('.download').click(function(){
    // get delivery type
    var delivery = $('input[name=delivery]:checked').attr('data-delivery');
    $table.data('tablesorter').widgetOptions.output_delivery = delivery;        
    $table.trigger('outputTable');
});

因此，您可以根据需要将其设置为简单或复杂（请参阅允许用户设置几乎所有选项的实际output widget demo）。

TableSorter：如何将结果导出到csv？

1 个答案: