使用jQuery在DataTables中对复选框进行排序

Question

我一直在尝试对DataTables jQuery插件中的复选框字段进行排序以检查和取消选中.

我在表格中创建输入(复选框),如下所示:

'<input type="checkbox" '+ check +' />'

check包含文本"checked"或"".

到目前为止,我只是尝试添加DOM复选框类型的排序,如下所示:

{ "sSortDataType": "dom-checkbox" }

当我使用插件的API文档中的整个代码时,我收到以下错误:

未捕获的TypeError:无法在我的控制台中读取未定义的属性'afnSortData'.

问题:按列标题不会通过选中或取消选中复选框对列进行排序.

我想得到建议如何修复上面提到的错误或另一种方法来排序只使用jQuery和插件的方法.

谢谢.

---

编辑

刚尝试使用固定代码 - 没有错误.但排序搞砸了:它只是互相替换而不是排序.例如:如果我选中了1个复选框而没有选中9复选框,则选中复选框将从第三位切换到第六位再从第三位切换到第三位,依此类推.

Answer 1

我所做的是在隐藏的P中创建一个bool var,因此它将与checkbox.than在同一个地方复选框.我禁用了复选框中的更改值选项,并且排序现在正在工作.

Answer 2

我不得不稍微调整一下提供的答案Moby's Stunt Double。无需额外的排序插件！只需一点自定义编码。

感谢大家的所有想法！由于某种原因，我必须对我的表进行特殊处理，这不是通用的解决方案。这对我来说很好。

我的复选框被禁用并以编程方式检查，因此我无法调用.checked. 基于 iColumn 的调用也让事情失败了；可能是因为我有一个隐藏的第 0 列。

这对我有用：

$.fn.dataTableExt.afnSortData['dom-checkbox'] = function  ( oSettings, iColumn ) {
    var aData = [];
    $(oSettings.oApi._fnGetTrNodes(oSettings)).each( function () {
        var checker = $(this).find('.classOnSurroundingSpan input');
        aData.push( checker.prop("checked")==true ? "1" : "0" );
    } );
    return aData;
}

我的标记看起来像这样（周围的跨度是启用跟踪禁用复选框点击的解决方案的一部分）：

<span class='classOnSurroundingSpan'><input type='checkbox' disabled='disabled'/></span>

我的表定义是（部分）：

"aoColumnDefs": [
    {"sSortDataType": "dom-checkbox",
    "aTargets":[1],
    "asSorting": ["desc"]}
]