Question

我有一张静态<td>和输入（包裹在td中）<td><input></td>的混合表。

要对已使用的Jquery data tables plugin数据进行排序和过滤，唯一的问题是它不会对<input>标记进行排序，只是将它们留在排序列表的底部（或者尽管搜索功能仍适用于所有单元格，但如果单击两次，则返回顶部。

有没有办法让数据表识别输入标签内的值并能够对它们进行排序，我希望用混合数据做这个，即一些静态td值（从服务器端的计算生成）和一些inputs？

我在这里解决了问题 - http://jsfiddle.net/qE2wV/5/

Answer 1

尝试编写自定义排序函数，如果行输入了文本，则可以检索输入的值。见下文，

function getValue(x) {
    if (x.indexOf('input') >= 0) {
        return $(x).val();
    }         
    return x;
}

现在，使用此函数实现下面的自定义比较器，

jQuery.fn.dataTableExt.oSort['cust-txt-asc'] = function (a, b) {
    var x = getValue(a);
    var y = getValue(b);
    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
};

jQuery.fn.dataTableExt.oSort['cust-txt-desc'] = function (a, b) {
    var x = getValue(a);
    var y = getValue(b);
    return ((x < y) ? 1 : ((x > y) ? -1 : 0));
};

使用上述搜索比较器

初始化数据表

$('#example').dataTable({"aoColumns": [
        { "sType": "cust-txt" },
        { "sType": "cust-txt" },
        { "sType": "cust-txt" },
        { "sType": "cust-txt" }
    ]});

DEMO： http://jsfiddle.net/eLTUa/

Answer 2

This DataTables example shows a sortable DataTable where the fields are inputs

包含初始化代码。

获取Jquery数据表以对包含输入的表进行排序

2 个答案: