Debugging IE8 Javascript Replace innerHTML Runtime

Question

function DeleteData(ID)
{
 var ctrlId=ID.id;

 var divcontents=document.getElementById(ctrlId).innerHTML;
 var tabid=ctrlId.replace(/div/,'tab');
 var tabcontents=document.getElementById(tabid).innerHTML;
 alert(document.getElementById(tabid).innerHTML);
 document.getElementById(tabid).innerHTML="<TBody><tr><td></td></tr><tr><td></td></tr><tr><td></td></tr></TBody>";
 document.getElementById(ctrlId).innerHTML='';

}

I am trying to replace the Table with empty table but

document.getElementById(tabid).innerHTML="<TBody><tr><td></td></tr><tr><td></td></tr><tr><td></td></tr></TBody>";

this line is causing Unknown Runtime Error

Answer 1

This is not a Big issue, since i faced same problem few days ago and the reason this error occurs in ie is that - There exists an error in our html format or you are using an element other than <td> to replace innerHTML ie use only, dont use tables,divs to replace innerHTML.

• SwapnilK

Answer 2

I find out that in IE8 some elements are in readonly: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR.

Therefore if you try to set innerHTML for these elements IE8 notify alter with Unknown Runtime Error.

More details here: http://msdn.microsoft.com/en-us/library/ms533897%28VS.85%29.aspx.

The simplest way is to convert read-only elements to div element.

Answer 3

When using YUI try to use

Y.one('#'+data.id).setContent(html); 

instead of:

Y.one('#'+data.id).set('innerHTML' , html);

Answer 4

Ohh yes - remember that the HTML structure has to be valid.

I tried loading an entire page into a <p> tag - it failed (obviously), changing it to a <div> tag solved my problem!

So remember the HTML structure!

Answer 5

why it happend in IE...

case scenario:

Javascript unknown runtime error in IE while accessing Div inside Div to add ajax contents.

solution:

dont ever place nested divs in between the form tags to play with there contents .. :)

Answer 6

You can't set value to a table's innerHTML, you should access to child cells or rows and change them like that :

document.getElementById(tabid).rows[0].cells.innerHTML = 'blah blah';

For more info/example : Table, TableHeader, TableRow, TableData Objects