DHTML image load in div.

[krymzon]

Let me dive right into the problem here. This might be a little hard to explain because i must do this without any displayed code because some sensitive information might be leaked if i post the code, sorry. anywho, on to the problem...

The basics behind what I'm trying to achieve are that I wish to dynamically populate a div tag with an image that i get from an image server on a mouse click. All the work has been done to accomidate the image access, and, in fact, my web app will work in Firefox perfectly. The image link in the div tag, is actually correct, even in IE. So, if I 'right click' the image placeholder and select 'show picture', the image will show up in all its glory.
I'm populating the dive tag via this line of code:
document.getElementById("RandomDivName").innerHTML=html;
Any ideas on why IE would refuse to show the image, eventhough, it works in mozilla and does have the correct link to the image.
any advice would be appreciated.

--there are 10 types of people in this world. those who know binary, and those who don't.--

 

[kaht]

you should just be able to dynamically change the src on the image tag instead of having to change the innerHTML of the div. Here's an example of what I mean. Without seeing your code it's really hard to tell you what you need to change, or what could be going wrong. So hopefully you can incorporate this code into your page:

<script type="text/javascript">

function changeImg(obj) {
   obj.src = "somepic2.jpg";
}

</script>
<img src="somepic1.jpg" id="myImg" />
<input type="button" value="change image" onclick="changeImage(document.getElementById('myImg'))" />

-kaht

[small]How spicy would you like your chang sauce? Oh man... I have no idea what's goin' on right now...[/small]

 

[krymzon]

Well, another problem spans from your solution Kaht. the image tags I'm using are dynamically generated in JavaScript (in a loop controlled by an array). So, I cannot directly change those image tag sources.
These image tags that are generated are put into div's on the page, however, i'm starting to think my problem might span from the dynamic generation of image tags.
Also, keep in mind, i'm using AJAX, so, i never post back to the page, therefore, a simple reload isn't a viable solution either

--there are 10 types of people in this world. those who know binary, and those who don't.--

 

[kaht]

the image tags I'm using are dynamically generated in JavaScript (in a loop controlled by an array). So, I cannot directly change those image tag sources.

That is completely untrue.

<script type="text/javascript">

for (i = 0; i < 10; i++) {
   document.write('<img src="somepic1.jpg" id="myImg' + i + '" />');
}

function changeImg(obj) {
   obj.src = "somepic2.jpg";
}

</script>
<input type="button" value="change image" onclick="changeImage(document.getElementById('myImg0'))" />

I think that perhaps the best thing for you to resolve your problem is to post some code with the sensitive data filtered, otherwise this could go on forever.

-kaht

[small]How spicy would you like your chang sauce? Oh man... I have no idea what's goin' on right now...[/small]

 

[krymzon]

K, I'll try. There is one part of my code that I can show you that contains this problem.
this is more or less my generic function that gets called to change my div's image.

function DisplayThyImage(im, name)
{

var html="",img="";

//don't worry about this code here
// img = imageserver_thumburl.replace("@@image", im);
// img = img.replace("@@w", "250");
// img = img.replace("@@h", "250");

html="<img width = \"250\" height = \"250\" src=\"" + img + "\">";
html+="<br>" + name;
//alert(html);
document.getElementById("ImageDisplay").innerHTML=html;
}

keep in mind, thats pretty early stage code, but thats more or less what the functionality will be

--there are 10 types of people in this world. those who know binary, and those who don't.--

 

[krymzon]

Also, i have rewritten a portion of my code to accomidate pre-generated image tag's, but the images still will not show up unless I'm in firefox, or i force IE to view the image

--there are 10 types of people in this world. those who know binary, and those who don't.--

 

[kaht]

Try this and see what happens:
Note: this assumes the image exists in the div in the first place - this function will only change the image. If the image is not in the div to begin with, it will not change. So, if you are using this function to provide the initial image AND to change the image, it will not work. You will need a function for both

function DisplayThyImage(im, name)
{

    var img="";

//don't worry about this code here
//    img = imageserver_thumburl.replace("@@image", im);
//    img = img.replace("@@w", "250");
//    img = img.replace("@@h", "250");

document.getElementById("ImageDisplay").[!]getElementsByTagName("img")[0].src[/!] = img;
}

-kaht

[small]How spicy would you like your chang sauce? Oh man... I have no idea what's goin' on right now...[/small]