jQuery DataTables移动列

问题描述：

我尝试使用jQuery DataTables插件中的colReorder.move().我使用构造函数来为此插件配置链接(我仅添加ColReorder扩展名)，并在我的asp net core 3项目中使用CDN链接.

I try to use colReorder.move() from jQuery DataTables plug-in. I use constructor for configure links for this plug-in (i only add ColReorder extension) and use CDN links in my asp net core 3 project.

@section Scripts {
    <script>
    $(document).ready(function () {
        var table = $('#parcel').DataTable({
            language: {
                url: "//cdn.datatables.net/plug-ins/1.10.21/i18n/Russian.json"
            },
            colReorder: true
        });
        table.colReorder.move(1, 2);
    });
    </script>
}

我有这个错误

jquery.min.js:2 Uncaught TypeError: Cannot read property 's' of undefined
    at _Api.<anonymous> (datatables.js:16874)
    at Object.move (datatables.js:7216)
    at HTMLDocument.<anonymous> (Parcels:1076)
    at l (jquery.min.js:2)
    at c (jquery.min.js:2)

答

这是因为语言URL的异步特性.在language.url 页面上指出:

It's because of the asynchronous nature of the language URL. On the language.url page it states:

请注意，设置此参数后，由于Ajax数据加载，DataTables的初始化将是异步的.也就是说，直到完成Ajax请求，才会绘制该表.因此，任何需要表完成其初始化的操作都应放入initComplete回调中.

Note that when this parameter is set, DataTables' initialisation will be asynchronous due to the Ajax data load. That is to say that the table will not be drawn until the Ajax request as completed. As such, any actions that require the table to have completed its initialisation should be placed into the initComplete callback.

因此，将代码放入initComplete中，如下所示:

Therefore, put the code into initComplete, like this:

$(document).ready(function() {
var table = $('#example').DataTable({
    language: {
        url: "//cdn.datatables.net/plug-ins/1.10.21/i18n/Russian.json"
    },
    colReorder: true,
    initComplete: function() {
        table.colReorder.move(1, 2);

    }
});

});

示例此处.

jQuery DataTables移动列

相关推荐