Hi, Is there a way to dynamically disable responsive on a button click ?

praveenb

Hi, Is there a way to dynamically disable responsive on a button click ? I'm enabling responsive using constructor. Is there a way to disable it dynamically ?

colin

No, it's an initialisation option without an API method to then disable it. The only thing you could do is to destroy() the table on the click of that button and initialise again without the responsive set,

Colin

praveenb

Thanks. I also noticed that using the responsive constructor in initComplete doesn't work for ajax data. The icon shows up but clicking on it doesn't show the child row. Is there any way to make this work ?

table = $("#example").DataTable({
destroy: true,
"ajax": {"url": url, "dataSrc": ""}
"initComplete": function (settings, json) {
new $.fn.dataTable.Responsive(table);
},
})

colin

I'm not sure why that wouldn't work, but can you just use responsive: true as in this example: http://live.datatables.net/voruhuwo/1/edit ?

Colin

praveenb

I can't use responsive: true because just before adding responsive I'm reordering the columns by getting order from database. Using responsive: true doesn't show the table correctly after reordering. Please let me know if there is any other way to do this.

table = $("#example").DataTable({
    destroy: true,
    "ajax": {"url": url, "dataSrc": ""}
    "initComplete": function (settings, json) {
         reorderColumns(table); //function to reorder columns by getting order from db
         new $.fn.dataTable.Responsive(table);
     },
})

kthorngren

I don't believe the table variable is assigned and ready to use inside initComplete. You can use this.api() to get an instance of the API. For example:

    "initComplete": function (settings, json) {
         var api = this.api();
         reorderColumns( api ); //function to reorder columns by getting order from db
         new $.fn.dataTable.Responsive( api );
     },

Kevin

praveenb

Thanks Kevin. this.api worked perfectly.