Responsive Occasionally Calculates Available Width Wrong When Toggling

zepernick

I have a intermittent problem that I am hoping can be worked around. Occasionally, when I have a DataTable in a div that is getting toggled on and off, the responsive plugin will collapse all the columns under the + as if there was not enough room to display them. This happens when the div that the table was in got hidden and then shown through the toggle(). I would rather not have to do something on every one of my tables to fix this problem. Is there a DataTable or jQuery event that I could listen for and then run responsive.rebuild / recalc?

larsonator

when you mean toggle, do you mean the div gets hidden or display:none?

i would listen for the event that hides and display's the div. this depends on if you are doing it yourself or using another set of libraries like jquery ui or bootstrap. for example.

for example. bootstraps collapsable panels, you would listen like so:

$("#collapsablepanel").on('shown.on.collapse', function(){
    myTable.responsive.recalc();
});

allan

As @larsonator suggests, I think it probably isn't a DataTables event that you want to listen for, since it knows nothing about your show / hide controls, but rather an event that is fired by whatever is doing the show / hide. Then run the required DataTables API methods.

Allan