Hide few column from default in datatable

Question

I am new to datatable, i am using colvis to show the columns in table, all the data i am getting from my database and i would like to keep few fields hidden by default. I am using this method to extends.

var oTable = table.dataTable({
        "language": {
            "aria": {
                "sortAscending": ": activate to sort column ascending",
                "sortDescending": ": activate to sort column descending"
            },
            "emptyTable": "No data available in table",
            "info": "Showing _START_ to _END_ of _TOTAL_ entries",
            "infoEmpty": "No entries found",
            "infoFiltered": "(filtered1 from _MAX_ total entries)",
            "lengthMenu": "_MENU_ entries",
            "search": "Search:",
            "zeroRecords": "No matching records found"
        },



        buttons: [
            { extend: 'csv', className: 'btn purple btn-outline ' },
            { extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
        ],



        "pageLength": 20,

        "dom": "<'row' <'col-md-12'B>><'row'<'col-md-6 col-sm-12'l><'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>"

    });
}

Now i dont know how can i keep columns hidden by default and show only if user select.

Hide few columns by default when table load.

Thank you!

Answer 1

Add className: 'hidden' to the column you want to be hidden for responsive table.

something like this:

$('#example').dataTable({
    "columnDefs": [
        { "visible": false, "targets": [0], className: 'hidden' }
    ]
});