Debugging IE8 Javascript Replace innerHTML Runtime Error

Question

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

 var divcontents=document.getElementById(ctrlId).innerHTML;
 var tabid=ctrlId.replace(/div/,\'tab\');
 var tabcontents=         


        

Answer 1

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

Answer 2

If you need to set innerHTML to "" (empty string) then you can use removeChild instead

Answer 3

In IE8, you cannot change the innerHTML of an object when the code that attempts that is fired from within the object.

For example:

<span id='n1'>
  <input type=button value='test' onclick='DoSomething(this);'>
</span>

with the following code tucked in some remote corner of your document:

<script type='text/javascript'>
  function DoSomething(element)
  {
    document.getElementById("n1").innerHTML = "This is a test"
  }
</script>

This will fail with the error unknown runtime error. I believe it has to do with the fact that you're trying to replace the HTML code which fired the current line of execution. The onclick event is part of the code being replaced by the DoSomething function. IE8 doesn't like that.

I resolved my issue by setting a timer event for 250 milliseconds, such that the function called at the end of the 250 milliseconds replaces the span's innerHTML.

Answer 4

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.