Spoonk
Spoonk

Reputation: 703

AJAX document.getElementById().innerHTML problem with IE?

Before someone said that I did not read I may say that I read almost everything linked with my question. But I couldn't find my answer. So, I have a simple AJAX script that loads my external file inside predefined div. This is the code of those script:

    function loadTwitter()
  {
  var xmlHttp;
  try
    {
    // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest();
    }
  catch (e)
    {
    // Internet Explorer
    try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
    catch (e)
      {
      try
        {
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
      catch (e)
        {
        alert("Your Browser Don't Support AJAX!");
        return false;
        }
      }
    }
    xmlHttp.onreadystatechange=function()
      {
      if(xmlHttp.readyState==4)
        {
        document.getElementById("column_twitter").innerHTML=xmlHttp.responseText;
        }
      }
    xmlHttp.open("GET","../includes/home/twitter.php",true);
    xmlHttp.send(null);
  }

It works just fine in everyone browser that I test (FF, Opera, Chrome, Safari), but inside IE7 don't want to inject my external php file into predefined div. It always stays the default text that I wright inside div... And I think that the problem is in this row:

document.getElementById("column_twitter").innerHTML=xmlHttp.responseText;

So, any suggestions how to fix this for IE (7 and above)?

Upvotes: 2

Views: 7494

Answers (2)

I know that this is an old question, but I ran into a similar thing today and I wanted to post it out for others in case you experience this issue. This is likely being caused by your "column_twitter" tag being embedded in multiple DIV statements or in a table. IE7 doesn't like this for some reason.

Good Luck!

Upvotes: 1

tvanfosson
tvanfosson

Reputation: 532435

I think you'd be better off using a javascript framework such as jQuery that allows you to concentrate on getting your features implemented rather than browser compatibility and low level network interaction. Using jQuery you could simply do:

<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script type="text/javascript">

$.get( '../includes/home/twitter.php', function(data) {
     $('#column_twitter').html( data );
});

</script>

Upvotes: 6

Related Questions