Infinite draw loop when having DT_RowId in ajax response

pgerundt

Hi guys,

ok, this took me 5 hours to find:
http://live.datatables.net/fudifija/1/edit

When having DT_RowId in the ajax response correctly set (see http://showroom.efficient.it/ajax.php) and using the example code from
https://datatables.net/extensions/searchpanes/examples/customFiltering/customOptionConditions.html, searchPanes crashes into an infinite draw loop.

Just click a checkbox of a row and check the console output.

Greetings,
Pascal

colin

I'll leave this one for Sandy, he'll be back in towards the end of next week,

Colin

sandy

Hi @pgerundt ,

When you rebuild SearchPanes it deselects everything and then rebuilds the pane completely before selecting the options that were selected before. Having a rebuildPane call for both deselect and select is what is causing your infinite loop. I've added a small flag to your test case and it seems to be working fine now.

Thanks,
Sandy

pgerundt

Hi @sandy,

thanks for the test case, I modified it here (changed dom to Pt):
http://live.datatables.net/susifaqo/3/edit

Now it's only working for the first click on a filter (select event).

I'm confused about your lines

if(!pauseRebuild) {
  pauseRebuild = true;
  dt.searchPanes.rebuildPane(0, true);
  pauseRebuild = true;      <- why true again?
}

This sets pauseRebuild to true on the first select event - but it never gets set back to false.

Changing these lines to

if(!pauseRebuild) {
  pauseRebuild = true;
  dt.searchPanes.rebuildPane(0, true);
  pauseRebuild = false;
}

results in an infinite draw loop again; see here:
http://live.datatables.net/susifaqo/4/edit

Changing these lines to

if(!pauseRebuild) {
  pauseRebuild = true;
  dt.searchPanes.rebuildPane(0, true);
}
else {
  pauseRebuild = false;
}

only works for the first click; see here:
http://live.datatables.net/susifaqo/5/edit

I will take a deeper look at the code.
My guess: rebuildPane() does not come with a callback function when done - so we cannot set back pauseRebuild to false after the rebuild is finished.
One other possible solution: rebuildPane() should not trigger the events select.dt/deselect.dt.

I will keep you updated with my findings.

Thanks,
Pascal

pgerundt

Hi @sandy,

wooohooo, I finally found a solution by excessive console.log debugging.

Here's my test case:
http://live.datatables.net/susifaqo/6/edit

Selecting the first filter:

"SELECT: event"  <- select event triggered by user interaction
"SELECT: pauseRebuild: false"  <- pause rebuild is initialized with false...
"SELECT: SET pauseRebuild TRUE" <- ... and set to true before...
"SELECT: rebuildPane() started." <- ...rebuilding the pane
"DRAW event"  <- draw event is fired by rebuildPane()
"SELECT: event"  <- select event is fired because one filter is selected
"SELECT: pauseRebuild: true"  <- pauseRebuild is true...
"SELECT: SET pauseRebuild FALSE"  <- ... and set back to false

Now selecting the second filter:

"SELECT: event"
"SELECT: pauseRebuild: false"
"SELECT: SET pauseRebuild TRUE"
"SELECT: rebuildPane() started."
"DRAW event"
"SELECT: event"
"SELECT: pauseRebuild: true"
"SELECT: SET pauseRebuild FALSE"

(same as above with first filter)

Now deselecting the first filter:

"DESELECT: event"  <- deselect event is triggered by user interaction
"DESELECT: pauseRebuild: false"  <- pauseRebuild is still false from above...
"DESELECT: SET pauseRebuild TRUE"  <- ...and set to true before...
"DESELECT: rebuildPane() started."  <- ...rebuilding the pane
"DRAW event"  <- draw event is fired by rebuildPane()
"SELECT: event"  <- select event is fired because the second filter is still selected
"SELECT: pauseRebuild: true"  <- pauseRebuild is true...
"SELECT: SET pauseRebuild FALSE"  <- ...and set back to false

Now deselecting the second filter:

"DESELECT: event"  <- deselect event is triggered by user interaction
"DESELECT: pauseRebuild: false"  <- pauseRebuild is still false from above...
"DESELECT: SET pauseRebuild TRUE"  <- ...and set to true before...
"DESELECT: rebuildPane() started."  <- ...rebuilding the pane
"DRAW event"  <- draw event is fired by rebuildPane()
<-  but no filter is selected now, so the select event is not triggered; pauseRebuild remains true causing no rebuildPane() from now on

But here's the solution:
http://live.datatables.net/susifaqo/7/edit

Ignoring pauseRebuild on deselect.dt event, because this event is not triggered when (re)drawing the table.

Would you agree that there is no more elegant way and we can consider this 'best practice' when having a filter for selected rows?

Greetings,
Pascal

pgerundt

Hi @sandy,

awww, snap. It does not work with dom: 'Bt' and cascadePanes: true:
http://live.datatables.net/susifaqo/10/edit

Selecting the first filter options gives this console output:

"FIRST ROW SELECTED true"
"FIRST ROW SELECTED true"
"FIRST ROW SELECTED true"
"FIRST ROW SELECTED true"
"DRAW EVENT"
"FIRST ROW SELECTED false"  <- wrong
"FIRST ROW SELECTED false"  <- wrong

With dom: 'Pt' everything is fine. So I guess there is a bug left somewhere.

Thanks,
Pascal

sandy

Hi @pgerundt ,

With searchPanes.cascadePanes this is going to get really complicated. I've raised an issue internally (DD-2530 for my reference) and we will report back here when there is an update. I suspect this may be a bit of a rabbit hole though so I'm not sure exactly when this will be.

Thanks,
Sandy