使用columns.orderData通过不可见数据列对DataTable进行排序

Question

对于我的问题，我准备了a simple test case at JS Bin。

在文字游戏中，我试图显示玩家玩的20个最长的单词。

我将数据从PostgreSQL传递到JSON格式的DataTables jQuery插件。它已按字长和播放单词的日期排序。

此订单在每个JSON对象的row属性中存储为数值（1,2,3，...）：

var dataSet = [
    {"row":4,"gid":1,"created":"25.02.2017 14:07","finished":null,"player1":2,"player2":1,"score1":30,"score2":52,"female1":0,"female2":0,"given1":"Abcde3","given2":"Ghijk4","photo1":null,"photo2":null,"place1":null,"place2":null,"word":"ZZ","score":11},
    {"row":2,"gid":1,"created":"25.02.2017 14:07","finished":null,"player1":2,"player2":1,"score1":30,"score2":52,"female1":0,"female2":0,"given1":"Abcde3","given2":"Ghijk4","photo1":null,"photo2":null,"place1":null,"place2":null,"word":"BBBBB","score":6},
    {"row":3,"gid":1,"created":"25.02.2017 14:07","finished":null,"player1":2,"player2":1,"score1":30,"score2":52,"female1":0,"female2":0,"given1":"Abcde3","given2":"Ghijk4","photo1":null,"photo2":null,"place1":null,"place2":null,"word":"ABC","score":7},
    {"row":1,"gid":1,"created":"25.02.2017 14:07","finished":null,"player1":2,"player2":1,"score1":30,"score2":52,"female1":0,"female2":0,"given1":"Abcde3","given2":"Ghijk4","photo1":null,"photo2":null,"place1":null,"place2":null,"word":"XYZXYZXYZ","score":6}
];

这是我的JavaScript代码，我尝试按不可见列word（第0列）对列row（第2列）进行排序：

function renderGid(data, type, row, meta) {
    return (type === 'display' ? '<IMG SRC="https://datatables.net/examples/resources/details_open.png"> #' + data : data);
}

function renderGame(data) {
    return 'Details for game #' + data.gid;
}

jQuery(document).ready(function($) {
    var longestTable = $('#longest').DataTable({
        data: dataSet,
        order: [[2, 'desc']],
        columns: [
            { data: 'row',   orderable: false, visible: false },
            { data: 'gid',   orderable: false, visible: true, className: 'details-control', render: renderGid },
            { data: 'word',  orderable: true,  visible: true, orderData: 0 /* order by invisible column 0 */ },
            { data: 'score', orderable: false, visible: true }
        ]
    });

    $('#longest tbody').on('click', 'td.details-control', function () {
        var img = $(this).find('img');
        var tr = $(this).closest('tr');
        var row = longestTable.row(tr);

        if (row.child.isShown()) {
            row.child.hide();
            img.attr('src', 'https://datatables.net/examples/resources/details_open.png');
        } else {
            row.child( renderGame(row.data()) ).show();
            img.attr('src', 'https://datatables.net/examples/resources/details_close.png');
        }
    });
});

然而这不起作用 - 显示的单词顺序是 ZZ，BBBB，ABC，XYZXYZXYZ （看似未分类） - 虽然它应该是 XYZXYZXYZ，BBBB，ABC，ZZ （按row降序排序）：

即使我已指定columns.orderData: 0，为什么不进行排序？

为什么我不能通过点击灰色箭头（上面屏幕截图中的红色箭头所示）来更改排序？

Answer 1

好的，这在dataTables jQuery插件中似乎是an old bug：不接受整数参数。

我必须将其更改为具有单个值的数组：

{ data: 'word',  orderable: true,  visible: true, orderData: [0] },

然后它起作用：