Changing innerHTML for div

Contributor
12Jan2010,19:02   #1
rekha's Avatar
Hi,

Div innerHTMl not working in IE6.

Code:
function toggleVisiblity()
{
  var name1="eg";
 
	var tbl = document.getElementById("chart1");alert(tbl);alert(tbl.style.display);
alert(tbl.nodeName);	var clink=document.getElementById("chartlink");

    if(tbl!=null){
	if (tbl.style.display == 'block')
	{
	    tbl.innerHTML="";
		tbl.style.display = 'none';
		
	}
	else
	{
	    tbl.innerHTML="<img src=../../temp/"+name1+".png>";
		tbl.style.display = 'block';
 	
	}
	}
}
Code:
<div align=left><a id='chartlink' href=# onclick=\"toggleVisiblity()\"><img src=\"../images/chart.gif\" border=0></a></div><div id='chart' style='display:none;' align=center></div>
In this code everytime eg.png is a new image.But the new image is not shown in the div but it is updating in the temp folder.
~ Б0ЯИ Τ0 С0δЭ ~
12Jan2010,19:41   #2
SaswatPadhi's Avatar
I think you missed a pair of quotes here :
Code:
.
.
	else
	{
	    tbl.innerHTML="<img src=../../temp/"+name1+".png>";
		tbl.style.display = 'block';
 	
	}
.
.
Try changing it to : tbl.innerHTML="<img src=\"../../temp/"+name1+".png\">";
Contributor
13Jan2010,10:14   #3
rekha's Avatar
Hi

Thanks for you reply.But I tried that also but is is also not working.The issue is not with the quotes.I think the issue is in the updation of the image.The new image is updated in the temp folder.But it is not updated even when the page is refreshed.

Pls help........
Ambitious contributor
13Jan2010,11:21   #4
venami's Avatar
Is the permission for the image file set correctly?
Ambitious contributor
13Jan2010,11:50   #5
venami's Avatar
I have made little changes to your code and posted here the corrected one. The problem seems to be the '\' escape character that you used, which is not required in your case. The changes are marked with red colour.

Code:
<html>

<head>
<title>Sample Page</title>
<script type="text/javascript">
function toggleVisiblity()
{
  var name1="eg";
 
    var tbl = document.getElementById("chart");
    alert(tbl);
    alert(tbl.style.display);
    alert(tbl.nodeName);
    var clink=document.getElementById("chartlink");

    if(tbl!=null){
    if (tbl.style.display == 'block')
    {
        tbl.innerHTML="";
        tbl.style.display = 'none';
        
    }
    else
    {
        tbl.innerHTML="<img src=../images/" + name1 + ".png>";
        tbl.style.display = 'block';
     
    }
    }
}
</script>
</head>

<body>
<div align=left>
<a id='chartlink' href=# onclick="toggleVisiblity()"><img src="../images/chart.gif" border=0></a>
</div>
<div id='chart' style='display:none;' align=center>
</div>
</body>

</html>
Let me know whether this works or not.

Last edited by venami; 13Jan2010 at 11:53.. Reason: Highlighted the changed part in red.
Contributor
13Jan2010,12:07   #6
rekha's Avatar
Hi venami,

I used the code inside php.So I used the escape symbol.Here I quoted just the code.

And also the permission for the image is set right.It is working fine in firefox.In IE it is not working.

Last edited by rekha; 13Jan2010 at 12:09.. Reason: content added
Ambitious contributor
13Jan2010,12:13   #7
venami's Avatar
Then it might be the Javascript compatibility issue with IE.

Since I wont be having access to the web server till Sunday, I could not help you immediately. Otherwise I could have done something now.
Contributor
13Jan2010,12:34   #8
rekha's Avatar
Hi venami,

Its ok.Thanks for your replies.If I found the workaround I will put it here.
Contributor
13Jan2010,15:06   #9
urstop's Avatar
Also, are your sure that it is going into the IF block of your javascript, did you verify that.
Contributor
13Jan2010,15:35   #10
rekha's Avatar
Hi,

Yes.It is going to the if block and tbl is not null only.