Column Visibility Datatables:

Column Visibility Datatables:







Jquery

-----------




$(document).ready(function() {

    var table = $('#example').DataTable( {

        "scrollY": "200px",

        "paging": false

    } );

 

    $('a.toggle-vis').on( 'click', function (e) {

        e.preventDefault();

 

        // Get the column API object

        var column = table.column( $(this).attr('data-column') );

 

        // Toggle the visibility

        column.visible( ! column.visible() );

    } );

} );




HTML

---------




<div>

Toggle column: 

<a class="toggle-vis" data-column="0">Name</a> - 

<a class="toggle-vis" data-column="1">Position</a> - 

<a class="toggle-vis" data-column="2">Office</a> - 

<a class="toggle-vis" data-column="3">Age</a> - 

<a class="toggle-vis" data-column="4">Start date</a> - 

<a class="toggle-vis" data-column="5">Salary</a>

</div>