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

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" }
    ]});

演示： http://jsfiddle.net/eLTUa/

Answer 2

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

包含初始化代码。

我没有在这里发布它，因为有版权声明，而且我知道一些数据表的东西不是免费的，比如编辑器。