How to set the src of a html <img> tag to a string returned from a jsp page?

A

Antti Nummiaho

I am trying to set the source (src) of a html <img> tag to a string
returned from a jsp page. So far without success. A simplified example
follows.

Example.html:

<html>
<head></head>
<body>
<script language="JavaScript" type="text/JavaScript">
document.writeln("<img src='Foo.jsp'>")
</script>
</body>
</html>

Foo.jsp:

<%@page contentType="text/html"%>
bar.png

The web browser (IE) sets the img src to the url of the jsp page (i.e.
http://localhost:8080/temp/foo.jsp) instead of the "bar.png" which the
jsp page returns (actually because of the contentType row, the jsp
page returns "\r\nbar.png" for some reason, but this is not the
problem since it does not help even if the contentType row is left
out).

So the question is how should the Example.html and Foo.jsp pages be
defined to get the html page to display the bar.png image or is it
even possible?
 
J

John C. Bollinger

Antti said:
I am trying to set the source (src) of a html <img> tag to a string
returned from a jsp page. So far without success. A simplified example
follows.

Example.html:

<html>
<head></head>
<body>
<script language="JavaScript" type="text/JavaScript">
document.writeln("<img src='Foo.jsp'>")
</script>
</body>
</html>

Foo.jsp:

<%@page contentType="text/html"%>
bar.png

The web browser (IE) sets the img src to the url of the jsp page (i.e.
http://localhost:8080/temp/foo.jsp) instead of the "bar.png" which the
jsp page returns (actually because of the contentType row, the jsp
page returns "\r\nbar.png" for some reason, but this is not the
problem since it does not help even if the contentType row is left
out).

So the question is how should the Example.html and Foo.jsp pages be
defined to get the html page to display the bar.png image or is it
even possible?
Click to expand...

If you want to set the URL in your script to some application-defined
value determined at request processing time, then make example.html a
JSP page and insert the value you want using JSP techniques. If instead
you want to add a layer of indirection to the identity of the image to
retrieve then in place of Foo.jsp use a servlet that delivers a response
with the correct content type containing the correct image data.
Conceivably, you could do both.


John Bollinger
(e-mail address removed)
 
K

Kent

Simplest case - Foo.jsp becomes

<%
String imgName = "bar.png"; // Or from db, delegate, etc.
%>
<html>
<head></head>
<body>
<img src='<%=imgName%>'>
</body>
</html>

If you're really trying to generate JavaScript (like to implement a
popup image browser) then do that here as well. You don't want 2 files
for this simple case.
 
A

Antti Nummiaho

Simplest case - Foo.jsp becomes

<%
String imgName = "bar.png"; // Or from db, delegate, etc.
%>
<html>
<head></head>
<body>
<img src='<%=imgName%>'>
</body>
</html>

If you're really trying to generate JavaScript (like to implement a
popup image browser) then do that here as well. You don't want 2 files
for this simple case.
Click to expand...

Ok. Maybe I simplified my problem a little too much.

Actually my goal is to have a html (or jsp) page where a user can
change the image presented on the page by pressing a button. The image
is generated on the fly on another jsp page (here Foo.jsp). The thing
is that I don't want the whole page to reload, only the image to
change.

So if I have in the html (or jsp) page the following action (in
javascript) executed after the user presses the button:
document.images.["IMG_NAME"].src= "Foo.jsp"

Then how should the Foo.jsp be defined?
 
T

Tor Iver Wilhelmsen

So if I have in the html (or jsp) page the following action (in
javascript) executed after the user presses the button:
document.images.["IMG_NAME"].src= "Foo.jsp"

Then how should the Foo.jsp be defined?
Click to expand...

JSPs are unsuited for this purpose, use a straight servlet instead.
 
J

John C. Bollinger

Antti said:
So if I have in the html (or jsp) page the following action (in
javascript) executed after the user presses the button:
document.images.["IMG_NAME"].src= "Foo.jsp"

Then how should the Foo.jsp be defined?
Click to expand...

As I wrote before, the resource that you name must deliver the image
content, not the name of the image content. The best way to do this is
with a straight servlet.


John Bollinger
(e-mail address removed)
 
A

Antti Nummiaho

John C. Bollinger said:
Antti said:
So if I have in the html (or jsp) page the following action (in
javascript) executed after the user presses the button:
document.images.["IMG_NAME"].src= "Foo.jsp"

Then how should the Foo.jsp be defined?
Click to expand...

As I wrote before, the resource that you name must deliver the image
content, not the name of the image content. The best way to do this is
with a straight servlet.
Click to expand...

But is there a way to achieve this functionality if the image is
created dynamically on a jsp page? I'm asking this because I'm trying
to use Cewolf (http://cewolf.sourceforge.net/) which is a jsp based
solution for generating charts dynamically (chart images are generated
on a jsp page).
 
J

John C. Bollinger

Antti said:
John C. Bollinger said:
Antti said:
So if I have in the html (or jsp) page the following action (in
javascript) executed after the user presses the button:
document.images.["IMG_NAME"].src= "Foo.jsp"

Then how should the Foo.jsp be defined?
Click to expand...

As I wrote before, the resource that you name must deliver the image
content, not the name of the image content. The best way to do this is
with a straight servlet.
Click to expand...


But is there a way to achieve this functionality if the image is
created dynamically on a jsp page? I'm asking this because I'm trying
to use Cewolf (http://cewolf.sourceforge.net/) which is a jsp based
solution for generating charts dynamically (chart images are generated
on a jsp page).
Click to expand...

If you want to select the file name dynamically then use JSP to insert
the name into the HTML document, and JSP (instead of JavaScript) to get
a new document with a different file name. You might be looking for
<jsp:include> to connect your app with Cewolf. I suggest you find a
good JSP tutorial, or better, the JSP specs.

If you want to deliver a dynamic image from one resource name then, as
you have been told three times previously, map a servlet to that
resource name, and have the servlet deliver the content directly.
Servlets can make use of request parameters and / or session attributes
to determine how to respond (as can JSPs).


John Bollinger
(e-mail address removed)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Align img inside nav tabs section 5
How to use PDF-lib and how to center each line of texts on the page? 1
Image shifts to the right when export the page to pdf 4
How to check the validation of js files or html files including js? 6
How to position the *tooltip* comment on these buttons? 9
Stuck with html and css 25
How to save JSON Data to a file using fetch() api? 2
Help with my responsive home page 2

Members online

No members online now.
Total: 32 (members: 1, guests: 31)
Robots: 431

Forum statistics

Threads
473,768
Messages
2,569,574
Members
45,051
Latest member
CarleyMcCr

Latest Threads

Top