FAQ

[Struts-user] Refreshing image with AJAX request

Frank W. Zammetti
Sep 25, 2008 at 3:52 pm
Ajax by its nature deals with textual information only, be it HTML, XML,
JavaScript or plain text. It has no capability to handle binary data
(talking about XMLHttpRequest only, there are other Ajax techniques that
can achieve it). So, when you make an Ajax request to get an image,
you'll get the data back as planned, but you'll get a textual
representation of it. There's no way to return an image, PDF, file to
download, and so on, from an Ajax request, and have the browser do what
you'd expect it to do with it because by the time it hits the browser it's
just a stream of text that you have to deal with in JavaScript, and since
there's no binary-handling capabilities in JavaScript (ignoring things
like Gears for the moment), you're stuck essentially with a big blob of
textual gibberish :)

The reason the image works the first time by the way is because even
though you point to an action, the <img> tag doesn't know that... so long
as the URL it refers to returns a valid image, it'll work as expected.

There's ways to do what you're trying to do... one is to simply update the
src attribute of the <img> tag in script and point it to the action, and
append a dummy parameter to it (something like the value of a new Date
object) to avoid IE GET caching. So long as the action gives you the
image back (based on whatever dynamic processing the target of your Ajax
request currently does), that should work fine.

I'll skip any other suggestions because they can get a bit wacky :) That
one is simple, and should work fine. It's not an Ajax request per se as
most people mean it, but it would update the image without rewriting the
page, which is what counts :)

hth,
Frank

--
Frank W. Zammetti
Author of "Practical Dojo Projects"
and "Practical DWR 2 Projects"
and "Practical JavaScript, DOM Scripting and Ajax Projects"
and "Practical Ajax Projects With Java Technology"
(For info: apress.com/book/search?searchterm=zammetti&act=search)
My "look ma, I have a blog too!" blog: zammetti.com/blog
On Thu, September 25, 2008 7:25 am, ManiKanta G wrote:
Hi,

I m returning an image through custom result from action, and when the
page
launches the image is getting displayed correctly.

But when I clicked the link to refresh, image is coming from action, but
as
I've specified the targets="" as the div, (instead of img tag) some
garbage
values are being displayed (I think it is displaying the content of the
image).

JSP:

<html>
<head>
<s:head theme="ajax"/>
</head>
<body>
<s:div id="imgDiv" theme="ajax">
<img src="ImageAction.action">
</s:div>
<s:url action="ImageAction.action" id="imgUrl"></s:url>

<s:a href="%{imgUrl}" targets="imgDiv" theme="ajax">Refresh</s:a>
</body>
</html>

Can some one tell me how to target an img tag instead of div tag?

Regards,
ManiKanta


---------------------------------------------------------------------
To unsubscribe, e-mail: user-unsubscribe@struts.apache.org
For additional commands, e-mail: user-help@struts.apache.org
reply

Search Discussions

Discussion Posts

Previous

Follow ups

Related Discussions

Discussion Navigation
viewthread | post
posts ‹ prev | 2 of 5 | next ›