Setting DataTables columns visibility

时间:2016-10-20 19:09:04

标签: javascript jquery datatables

I have problem with setting Datatables columns visibility. My code sets right value to column visibility but does nothing after that, never shows "done"
https://jsfiddle.net/s06e0d60/1/ Here is example that works on JSFiddle but some way doesn't work on my computer

var table = ...
var tabVis = $('.toggle-vis');

console.log("checking first checkbox");
var checked = tabVis[0].checked;

console.log("finding column");
var column = table.column(0);

console.log("assigning value");
column.visible(checked);

console.log("done");

Similar code in another place works perfectly

$(document).ready(function () {
    var table = $('#myTable').DataTable({
        scrollX: "100%",
        scrollY: '50vh',
        scrollCollapse: true,
        paging: false,
        fixedColumns: true,
        select: {
            style: 'multi'
        },
        columnDefs:
            [
                {
                    targets: [0],
                    orderData: [0, 1, 2]
                },
                {
                    targets: [1],
                    orderData: [1, 2, 0]
                },
                {
                    targets: [2],
                    orderData: [2, 0, 1]
                }

            ],

        language: {
            "url": "//cdn.datatables.net/plug-ins/1.10.12/i18n/Polish.json",
            select: {
                rows: {
                    _: "Wybrano wierszy: %d",
                    0: "Kliknij wiersz aby go zaznaczyć"
                }
            }
        }
    });

    $('.toggle-vis').on('change', function (e) {
        //e.preventDefault();
        var source = event.target || event.srcElement;

        // Get the column API object
        var column = table.column($(this).attr('dataColumn'));

        // Toggle the visibility
        column.visible(source.checked);
    });
});

SOLVED

I changed column().visible(x) function to column().visible(x, false) which prevents recalculating column layout and everything magically started working.

0 个答案:

没有答案