By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
457,910 Members | 1,293 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 457,910 IT Pros & Developers. It's quick & easy.

Problem loading an image from client side code

P: n/a
Hello,

Having an issue with JavaScript in my ASP.Net page.

I use some COTS, which for all intents and purposes, simply makes a
jpeg file and physically places it in a directory on the web server.

The page load codebehind, makes a connection to the jpeg creation
service and gets the path of the newly created image.

The sample code I'm providing is very simple... no rocket science here.
Here's the code behind:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Me.Load

Dim j As New jpegImage ' removed code for COTS & replaced
with psuedocode for posting purposes.
Dim c As New serviceConnector ' removed code for COTS & replaced
with psuedocode for posting purposes.
Dim urlImage

c = Server.CreateObject("Connector") ' removed code for COTS &
replaced with psuedocode for posting purposes.
c.ServerName = "DC1" ' Server's name
c.ServerPort = 5300 ' Server's port

j = Server.CreateObject("Jpeg") ' removed code for COTS &
replaced with psuedocode for posting purposes.
urlImage = j.GetImageAsUrl() ' string with path to newly
created jpeg file on server

Me.mapImageSrc_hidden.Value = urlImage

End Sub

Okay... you'll see that I'm using a hidden field in the page markup.
There's a bunch of reasons for this madness I'll skip for now but I
need the client to load the image... not the server. Here's what
happens next:

<asp:HiddenField ID="mapImageSrc_hidden" runat="server" />
<img id="mapImage" src="Images/null.gif" onload="getImage();" />

And in here's the getImage method:

function getImage()
{
var objHiddenImage =
document.getElementById("mapImageSrc_hidden");
var objMapImage = document.getElementById("mapImage");

objMapImage.src = objHiddenImage.value;
}

The problem is on the last line of the getImage method... when I put
the hidden field's value in the src property of the html image, the
page gets stuck in an infinte loop. It's as if the page never fully
loads, even though image generation is complete on the server, so the
onload=getImage() keeps getting fired over and over again.

Adding a "return" to the function doesn't help... nor does checking for
top.PostBackDone. Additionally I tried putting the call in
window.onload...

<head>
<script type="text/javascript">
function getMap()
{
if (arguments.callee.done) return;

arguments.callee.done = true;
var objHiddenImage =
document.getElementById("mapImageSrc_hidden");
var objMapImage = document.getElementById("mapImage");

objMapImage.src = objHiddenImage.value;
}
window.onload = getMap;
</script>
</head>

On objMapImage.src = objHiddenImage.value, I get the "null is null or
not an object" error and the image doesn't show... even though
debugging clearly shows a valid path string in objHiddenImage.value!!!

Any suggestions are greatly appreciated.

Thanks!

Jan 24 '07 #1
Share this Question
Share on Google+
11 Replies


P: n/a
Lee
Adam Sandler said:
>Okay... you'll see that I'm using a hidden field in the page markup.
There's a bunch of reasons for this madness I'll skip for now but I
need the client to load the image... not the server.
The server never loads images.
They're always loaded by the client via a separate request back
to the server, so throw away all that nonsense and simply write
the URL of the image into the src attribute of the image.
--

Jan 24 '07 #2

P: n/a


On Jan 24, 1:02 pm, Lee <REM0VElbspamt...@cox.netwrote:
The server never loads images.
Your absolutely correct. And I didn't mean to imply otherwise.

However, the server creates the image at runtime. The client doesn't
have, nor will it ever have, knowledge of this runtime creation. So I
use the hidden field in ASP.NET as a container between the server side
and client side. The server side sends the url of the runtime image to
the hidden field and the client side traces the DOM to pull the value
out of the hidden field.
simply write the URL of the image into the src attribute of the image.
okay... but what's the difference between authoring some document.write
staments or objMapImage.src = objHiddenImage.value???

Jan 24 '07 #3

P: n/a
Lee
Adam Sandler said:
>
On Jan 24, 1:02 pm, Lee <REM0VElbspamt...@cox.netwrote:
>The server never loads images.

Your absolutely correct. And I didn't mean to imply otherwise.

However, the server creates the image at runtime. The client doesn't
have, nor will it ever have, knowledge of this runtime creation. So I
use the hidden field in ASP.NET as a container between the server side
and client side. The server side sends the url of the runtime image to
the hidden field and the client side traces the DOM to pull the value
out of the hidden field.
>simply write the URL of the image into the src attribute of the image.

okay... but what's the difference between authoring some document.write
staments or objMapImage.src = objHiddenImage.value???
Besides the fact that one will work?
--

Jan 24 '07 #4

P: n/a
Lee
Adam Sandler said:
>
On Jan 24, 1:02 pm, Lee <REM0VElbspamt...@cox.netwrote:
>The server never loads images.

Your absolutely correct. And I didn't mean to imply otherwise.

However, the server creates the image at runtime. The client doesn't
have, nor will it ever have, knowledge of this runtime creation. So I
use the hidden field in ASP.NET as a container between the server side
and client side.
The server side sends the url of the runtime image to
the hidden field and the client side traces the DOM to pull the value
out of the hidden field.
>simply write the URL of the image into the src attribute of the image.

okay... but what's the difference between authoring some document.write
staments or objMapImage.src = objHiddenImage.value???
No, you don't need document.write statements. Write the URL of your
generated src into the HTML when you generate the page on the server.
That src won't be accessed by the server, only by the client.
--

Jan 24 '07 #5

P: n/a
Lee
Lee said:
>
Adam Sandler said:
>>
On Jan 24, 1:02 pm, Lee <REM0VElbspamt...@cox.netwrote:
>>The server never loads images.

Your absolutely correct. And I didn't mean to imply otherwise.

However, the server creates the image at runtime. The client doesn't
have, nor will it ever have, knowledge of this runtime creation. So I
use the hidden field in ASP.NET as a container between the server side
and client side. The server side sends the url of the runtime image to
the hidden field and the client side traces the DOM to pull the value
out of the hidden field.
>>simply write the URL of the image into the src attribute of the image.

okay... but what's the difference between authoring some document.write
staments or objMapImage.src = objHiddenImage.value???

Besides the fact that one will work?
My news host won't seem to allow me to cancel this post.
--

Jan 24 '07 #6

P: n/a
VK


On Jan 24, 8:20 pm, "Adam Sandler" <cor...@excite.comwrote:
<img id="mapImage" src="Images/null.gif" onload="getImage();" />

And in here's the getImage method:

function getImage()
{
var objHiddenImage =
document.getElementById("mapImageSrc_hidden");
var objMapImage = document.getElementById("mapImage");

objMapImage.src = objHiddenImage.value;
}

The problem is on the last line of the getImage method... when I put
the hidden field's value in the src property of the html image, the
page gets stuck in an infinte loop.
Of course it does. This is from the "Top 10 of dummy errors in
JavaScript" :-)

Image loads and calls onload handler. Onload handler instructs to load
another image instead of the current one. New image loads and calls
onload handler. See the top... and so on...
With all <layers>, <iframesand <imgput in onload loop this way
since 1997 one could make a mountain with its paramount in the
stratosphere, so don't be ashamed - you are not the first and most
definitely not the last. :-)

out:
objMapImage.src = objHiddenImage.value;
in:
if (objMapImage.src != objHiddenImage.value) {
objMapImage.src != objHiddenImage.value;
}

P.S. More sophisticated ways with removing event listener on first call
are also possible.
Whatever you are doing with image load sequence seems very strange -
but OK, it is your doing.

Jan 24 '07 #7

P: n/a
Lee <RE**************@cox.netwrote in news:ep*********@drn.newsguy.com:
Adam Sandler said:
>>Okay... you'll see that I'm using a hidden field in the page markup.
There's a bunch of reasons for this madness I'll skip for now but I
need the client to load the image... not the server.

The server never loads images.
They're always loaded by the client via a separate request back
to the server, so throw away all that nonsense and simply write
the URL of the image into the src attribute of the image.
Learn to use server-side scripting properly, whether it's PHP, ASP,
ColdFusion or whatever.

Your server-side script generates an image and puts it in a file on your
server, right?

In your source code for the web page, you'll have something like this:

<img src="_insert_file_name_here_">

where "_insert_file_name_here_" means that your scripting language
outputs the actual name of the file between the quotes.

Compare: If your image is static in a file named myImage.jpg, you'd have

<img src="myImage.jpg">

Jan 25 '07 #8

P: n/a
Lee
NO said:
>
Lee <RE**************@cox.netwrote in news:ep*********@drn.newsguy.com:
>Adam Sandler said:
>>>Okay... you'll see that I'm using a hidden field in the page markup.
There's a bunch of reasons for this madness I'll skip for now but I
need the client to load the image... not the server.

The server never loads images.
They're always loaded by the client via a separate request back
to the server, so throw away all that nonsense and simply write
the URL of the image into the src attribute of the image.

Learn to use server-side scripting properly, whether it's PHP, ASP,
ColdFusion or whatever.

Your server-side script generates an image and puts it in a file on your
server, right?

In your source code for the web page, you'll have something like this:

<img src="_insert_file_name_here_">

where "_insert_file_name_here_" means that your scripting language
outputs the actual name of the file between the quotes.

Compare: If your image is static in a file named myImage.jpg, you'd have

<img src="myImage.jpg">
Note that you responded to my post, and not to the person with
the problem.
--

Jan 25 '07 #9

P: n/a
Lee <RE**************@cox.netwrote in news:ep********@drn.newsguy.com:
>
Note that you responded to my post, and not to the person with
the problem.
Yes, that's because I trimmed the quoted text. But my reply was intended
to enlighten the original poster, not you. No offense.
Jan 25 '07 #10

P: n/a
Lee
NO said:
>
Lee <RE**************@cox.netwrote in news:ep********@drn.newsguy.com:
>>
Note that you responded to my post, and not to the person with
the problem.

Yes, that's because I trimmed the quoted text. But my reply was intended
to enlighten the original poster, not you. No offense.
No offense taken, but you risk having the OP ignore your post, because
it appears to be directed to me.
--

Jan 25 '07 #11

P: n/a


Lee and VK... thanks for the replies.

Jan 26 '07 #12

This discussion thread is closed

Replies have been disabled for this discussion.