Question

我是Datatable的新手，我正在尝试配置Datatable，以便它使用ajax获取数据，将其显示为复选框，锚点和选项卡，并允许用户对其进行排序。我有ajax和格式化部分，但是当我尝试对复选框进行排序时，它什么也没做。我抬起documented example并从中取出了排序处理程序：

排序代码：

/* Create an array with the values of all the checkboxes in a column */
        $.fn.dataTableExt.afnSortData['dom-checkbox'] = function (oSettings, iColumn) {
            var aData = [];
            $('td:eq(' + iColumn + ') input', oSettings.oApi._fnGetTrNodes(oSettings)).each(function () {
                aData.push(this.checked == true ? "1" : "0");
            });
            return aData;
        }

创建复选框的代码：

    $('#example').dataTable({
        "bProcessing": true,
        "sAjaxSource": "sources/myData.json",
        "sAjaxDataProp": "items",
        "aoColumns": [
            {
                "mData": function (source, type, val) {
                    if (source.Published)
                        return '<input type="checkbox" checked="checked"/>';
                    else
                        return '<input type="checkbox" />';

                },
                //"sType": "dom-checkbox",
                "sSortDataType": "dom-checkbox"
                //, "bSortable": false
            },
            { "mData": "Author" },
            {
                "mData": function (source, type, val) {
                    return '<a href="' + source.Href + '">' + source.$name + '</a>';
                }
            }
        ]
    });

调用排序函数（$.fn.dataTableExt.afnSortData['dom-checkbox']并返回数据，但表不会更新。（代码可以工作但不适用于ajax表）。

数据样本：

{
    "items": [
        {
            "$name": "a",
            "Href": "http://google.com",
            "Author": "a",
            "Published": true
        },
        {
            "$name": "c",
            "Href": "http://www.whiskas.at/",
            "Author": "a",          
            "Published": false
        }
    ]
}

Answer 1

请注意，您编写的是标准JavaScript，而不是jQuery。如果这是指jQuery对象而不是DOM元素，则检查将是未定义的，因为jQuery对象没有checked属性。如果这是一个jQuery对象，您可以尝试以下一些示例：

this.prop("checked");

或

$(this).is(":checked")

将其替换为当前排序功能中的this.checked。这是一个例子：

//Create an array with the values of all the checkboxes in a column
$.fn.dataTableExt.afnSortData['dom-checkbox'] = function (oSettings, iColumn) {
  var aData = [];
  $('td:eq(' + iColumn + ') input', oSettings.oApi._fnGetTrNodes(oSettings)).each(function() {
    aData.push($(this).is(':checked') == true ? "1" : "0"); //New jQuery variable here
  });
  return aData;
}

使用Ajax数据源时的数据表排序

1 个答案: