Issue recalculating column widths after ajax call

dlanz38

I'm populating a datatable via AJAX with responsive set to true. I'm using column priority to determine which columns should be hidden first. The problem I'm running into is the column widths and hidden columns. They are being calculated before the data is populated into the table which causes the entire table to be wider than expected after population. I understand why this is happening and found the responsive.recalc() feature, but am having trouble figuring out where to place it. Where ever I place it, it seems to have no effect. However when I call the function from the browser console it works as expected. I suspect there is a race condition between when the AJAX data is being populated and when the recalc() call is made. I found options such as ajax.dataSrc, the drawCallback event and even the xhr.dt event, but it seems to be the same exact behavior.

For example I have:

/* Could be called by multiple pieces of code*/
function customEvent(e){
    table.search(e.value).draw();  /*Must trigger the draw event, but move on to the next line while it's being processed*/
    table.responsive.recalc();   /*Essentially has no effect.*/
}

I could add a hardcoded delay, but I feel like this is a common enough issue that a proper mechanism already exist to solve it. Is there a callback for after the data is populated or something else I can use? Or should the above mentioned methods achieve what I want and I need to look closer at my code? I'm just not sure if these events should work and I need to work on it/troubleshoot more, or if I'm just looking at the wrong events. A confirmation on either would be greatly appreciated.

allan

Hi,

This is where I would call it. I'm actually surprised that it doesn't do that already!!

Try dropping dt.responsive.recalc() into that draw event handler and that should do the business.

I'll look into committing that in as well.

Allan

edit correct method name

dlanz38

Thank you very much. This worked perfectly.

Andrew1178

Hey Allan,

This question was made a year ago and I have the most recent version of the responsive extension(2.2.1) but as far I know this hasn't been included in any of the releases yet. I would prefer not to modify the source code due to any update of the package would cause the change to be overwritten.

Do you have any idea when the change will be made into the responsive extension?

P.S: Datatables and all its extensions are amazing!

allan

Thanks .

Although not all that amazing as this one slipped by me! I've added it to our list of things to fix for the next release of Responsive which hopefully shouldn't be too far away.

Allan

Andrew1178

Thank you for taking the time to look at this and add it to your list for next release. I really appreciate it!