使用DeferRender选项访问未加载的DataTable节点

时间:2016-09-05 12:19:30

标签: datatables-1.10 deferred-rendering

我的问题是我有一个包含数千个数据的数据表,我在Internet Explorer 11上遇到了性能问题(我不想< 11而且我在Firefox和Chrome上没有遇到任何问题)。为了解决性能问题,我将deferRender: true添加到我的dataTable中,这非常成功,但后来我遇到了另一个我还没有解决的问题。

新问题是我的表的每一行都有一个复选框,数据表头有一个复选框,当点击它时,它会选中/取消选中所有行复选框。 当点击发生时,我通过执行var allNodes = myTable.rows().nodes()检索表格中的所有节点,并更改每行复选框的checked属性。

没有deferRender选项我正在检索所有节点,但由于我有这个选项正在进行延迟加载,我只检索已经加载的节点(第一页和加载的页面)。

所以我的问题是: 有没有办法保持IE性能补丁与延迟加载deferRender选项,仍然可以访问所有节点(可能通过我还没有找到的功能)或是否有另一种方法来提高IE的性能?

感谢您的帮助。

P.S。 :如果需要,我在这里添加我的数据表初始化代码:

$('#myTable').DataTable({
        ajax: {
            url: myUrl,
            contentType: 'application/json',
            type: 'POST',
            data: function (d) {
                return JSON.stringify(dataToSend);
            }
        },
        columns: [
            {
                data: 'Identifier',
                type: 'html',
                sortable: false,
                render: function (data, type, row) {
                    return '<input type="checkbox" name="checkboxRow" value="' + $('<div/>').text(data).html() + '">';
                }
            },
            {
                data: 'Mnemo',
                render: function (data, type, row) {
                    return '<a class="hand-cursor">' + $('<div/>').text(data).html() + '</a>';
                    }
            },
            { data: 'FamGam.Family' },
            { data: 'FamGam.Gamme' },
            {
                fnCreatedCell: function (nTd, oData, iRow, iCol) {
                    if (oData === 'En service') {
                        $(nTd).addClass('cell-text-green');
                    } else if (oData === 'En cours de démontage') {
                        $(nTd).addClass('cell-text-orange');
                    }
                },
                data: 'dataState.Libelle'
            },
            { data: 'IdentifierUI' },
            { data: 'TechnicalRoom.InterventionUnitySenderSite' },
            { data: 'IdentifierTechnicalRoom' },
            {
                type: 'html',
                sortable: false,
                defaultContent: '<img class="imgBtn secondBtn" ' +
                                     'src="' + urlImages + '/edit.png" ' +
                                     'alt="Editer" title="Editer" />'
            }
        ],
        deferRender: true,
        destroy: true,
        searching: true,
        retrieve: true,
        order: [1, 'asc']
});

0 个答案:

没有答案