Display column on click of button in Datatable

Question

I am using Datatable - table plugin for JQuery - as following :

$('#my_table').DataTable({
    ...,

    "aoColumns": [
        {"bSortable": false,
            render: function (data, type, row, meta) {
                return meta.row + meta.settings._iDisplayStart + 1;
            } 
        },
        {"bSortable": false},
        {"bSortable": false},
        {"bSortable": false},
        {"bSortable": true, bVisible:false}, /* to hide */
        {"bSortable": false},
    ],
    ...
});

As one can see in the code,the 5th column is hidden. I want to show this column on a click of button. Can anyone please help me in achieving this?

Thanks in advance.

Mittal Patel · Accepted Answer · 2018-01-05 05:33:46Z

2

You can hide/show the column as below:

$("#btn").click(function() {
    var table = $('#my_table').DataTable();
    table.column(4).visible(true);
});

Another way is

$("#btn").click(function() {
    var table = $('#my_table').DataTable();
    table.fnSetColumnVis( 4, true );
});

answered Jan 5, 2018 at 5:33

Mittal Patel

2,74716 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Manuel Pirez · Accepted Answer · 2018-01-05 05:36:38Z

0

You could add an external event like .onClick('element') in a button or attach it to the row identifier that listens and change the bVisible property, or perhaps, you can also incude a callback function in the object property to perform the change : {"bSortable": true, bVisible:function(){/*listen to click event on a specific element*/}},

note that maybe you will need to render the table again, since it have trouble dealing with incomplete tables and functionalities maybe are truncated, i'll get back with more info.

answered Jan 5, 2018 at 5:36

Manuel Pirez

6057 silver badges9 bronze badges

Collectives™ on Stack Overflow

Display column on click of button in Datatable

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related