innerHTML replaces & with &

I have an ajax script that returns a lot of data including an image tag
<img src="index.php?module=image&action=resize&pic=temp.jpg"/>

Now when I want to place the data into a div tag
var response = transport.responseText || "error while retrieving tab "+file;
document.getElementById('tabContent').innerHTML = response;
                      
innerHTML replaces & with &amp;
needless to say my image source link won't work of course. How can I stop innerHTML from replacing &?
zotteke123Asked:
Who is Participating?
 
hernst42Commented:
That example is correct. It should display that way, but the browser should request it without the & when asking the server.
Request send to the server:
[27/Jul/2007:00:04:11 +0200] "GET index.php?module=image&action=resize&pic=temp.jpg HTTP/1.1" 200 133  "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.5) Gecko/20070713 Firefox/2.0.0.5"
So the everything is valid. See http://www.htmlhelp.com/tools/validator/problems.html#amp
0
 
amit_gCommented:
How are you checking that? That would probably not cause any problem.

Can you browse to index.php?module=image&action=resize&pic=temp.jpg and get the image manually? Make sure to use the same exact path. For example if your URL to the page where you are using AJAX is

http://someplace.com/somedir/somepage.php

then use

http://someplace.com/somedir/index.php?module=image&action=resize&pic=temp.jpg

does the above URL work? If your index.php is in root directory then the image tag should probably be

<img src="index.php?module=image&action=resize&pic=temp.jpg"/>
0
 
raj3060Commented:
change & with &amp;

<img src="index.php?module=image&amp;action=resize&amp;pic=temp.jpg"/>
0
Cloud Class® Course: MCSA MCSE Windows Server 2012

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

 
amit_gCommented:
the last line should be

<img src="/index.php?module=image&action=resize&pic=temp.jpg"/>
0
 
DigitalTyrantCommented:
I have used Ajax calls on multiple projects to load HTML into an object and haven't ever experienced this problem.  Would you mind posting you javascript source?
0
 
hernst42Commented:
Maybe the problem is more on the server-part which escapes multiple times the & in the response. Which AJAX framework are you using?
0
 
zotteke123Author Commented:
simple testcase:
<div id="data">test</div>
<script>
document.getElementById('data').innerHTML = '<img src="index.php?module=image&action=resize&pic=temp.jpg"/>';
alert(document.getElementById('data').innerHTML);
</script>

innerHTML will replace & with &amp;
which makes the url useless...
0
 
amit_gCommented:
Your example works just fine. I have used this several times and it works without any problem. You are looking at the wrong place. Check index.php manually in the browser. Most likely you are using incorrect path. The link has to be either absolute or relative to current URL.

Another possibility is that server itself is sending incorrect data.
0
 
DigitalTyrantCommented:
The alert() function will automatically encode & as &amp;  This doesn't mean the html is being encoded as well.  If you check the properties of the image, does it show &amp; or just &?
0
 
zotteke123Author Commented:
I was being an idiot
Must be tired
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.