IE8 + fnDestroy(), DataTables 1.8.2, jQuery 1.6.2
IE8 + fnDestroy(), DataTables 1.8.2, jQuery 1.6.2
isilweo
Posts: 1Questions: 0Answers: 0
Hey,
i was fighting today with error on IE8 when doing fnDestroy() and i tracked down bug. Problem happens when you have 2 tables next to eachother inside other element. ie
[code]
[/code]
now when you make data table on both like $("#t1").dataTable() and try to destroy one of them you got error. the error happens in line 2234 on DataTables 1.8.2
[code]
if ( oSettings.nTableReinsertBefore )
{
nOrig.insertBefore( oSettings.nTable, oSettings.nTableReinsertBefore ); //<---- here
}
[/code]
when both tables are sorounded by their own div's everything seems to be ok. like example below
[code]
[/code]
demos you can check this behavior
http://www.unitedbytes.pl/tmp/datatables/index.html - here is with the bug. click "click me" button
http://www.unitedbytes.pl/tmp/datatables/index_ok.html - here tables are sorounded by DIVs and it is ok
----
as an explanation of why i found this.
i use two tables that compares data from diffrent time periods. But data loaded inside have sometimes 3 and sometimes 4 columns. Data is loaded using ajax so i need to recreate tables. to recreate i use fnDestroy() and after that .empty()
greetings
isilweo
i was fighting today with error on IE8 when doing fnDestroy() and i tracked down bug. Problem happens when you have 2 tables next to eachother inside other element. ie
[code]
[/code]
now when you make data table on both like $("#t1").dataTable() and try to destroy one of them you got error. the error happens in line 2234 on DataTables 1.8.2
[code]
if ( oSettings.nTableReinsertBefore )
{
nOrig.insertBefore( oSettings.nTable, oSettings.nTableReinsertBefore ); //<---- here
}
[/code]
when both tables are sorounded by their own div's everything seems to be ok. like example below
[code]
[/code]
demos you can check this behavior
http://www.unitedbytes.pl/tmp/datatables/index.html - here is with the bug. click "click me" button
http://www.unitedbytes.pl/tmp/datatables/index_ok.html - here tables are sorounded by DIVs and it is ok
----
as an explanation of why i found this.
i use two tables that compares data from diffrent time periods. But data loaded inside have sometimes 3 and sometimes 4 columns. Data is loaded using ajax so i need to recreate tables. to recreate i use fnDestroy() and after that .empty()
greetings
isilweo
This discussion has been closed.
Replies
[code]
....
Some text
Some text
......
//
......
oTable=$("#t1").dataTable({....});
......
......
if (typeof oTable!= 'undefined')
{
oTable.fnDestroy();
oTable= undefined;
}
[/code]
Invalid argument.
[code]
if ( oSettings.nTableReinsertBefore )
{
nOrig.insertBefore( oSettings.nTable, oSettings.nTableReinsertBefore ); //<---- here
}
[/code]
aoData[i].nTr.insertBefore(
aoData[i]._anHidden[iCol],
_fnGetTdNodes( oSettings, i )[iBefore] );
After long debugging we figured out that IE8 searches for the nextSibling of the table after destroy.
Chrome takes the line-break after the table as the sibling element to place the new table before. IE8 just seems to don't find anything but takes an iFrame as the sibling. As there is no iFrame to insert the table before the script would break down.
A fix for this to work properly in IE8 is to define an empty div after the table, so IE8 can find a proper sibling.