• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

JSP not displaying images

 
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi

I have checked on many forums and find that this is very common issue.

I am trying to display an image through JSP but it is not picking up the image path. I have tried both the Absolute and Relative path but still the image is not displaying.

I tried to dynamically grab the context path and used an EL expression
${pageContext.request.contextPath}/webapps/img/cal.gif
but the image is not getting displayed.

The image folder is under contextroot/webapps.

-contextroot
--webapps
---img

When i put URL http://localhost:8080/contextroot/webapps/img/cal.gif in browser to fetch image, it returns to same page.

I have also checked the case for entire path (as mentioned in many forums) and the case is correct.

Please let me know what is missing.

Thanks in advance.

Anu

 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Is ${pageContext.request.contextPath} correctly emitting /contextpath?

P.S. webapps is a really really bad name to use for a folder. (Confusion with Tomcat webapps folder).
 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Yes, ${pageContext.request.contextPath} is correctly emitting /contextpath. The value coming from ${pageContext.request.contextPath}/webapps/img/cal.gif is /contextroot/webapps/img/cal.gif.
I have tried moving img folder one level up under contextroot and tried ${pageContext.request.contextPath}/img/cal.gif but still image is not getting displayed.

The application is deployed in Tomcat.

Anu
 
Ranch Hand
Posts: 138
Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I have this set-up which works.

Images are placed at the following location:
/Web Content/image/<all images here>

i have written following code in the JSP. (Not tried with EL though)



Web Content folder is created by Eclipse and I have WEB-INF inside it.

 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I have placed image folder as you suggested to WebContent folder and tried using <%=request.getContextPath()%>/img/cal.gif but the images are still not getting displayed.
When i right click image to know its path by clicking properties it shows URL as http://localhost:8080/contextroot/img/cal.gif.

When i put this URL in browser it comes to same page.
 
Prajakta Acharya
Ranch Hand
Posts: 138
Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Can you verify if the deployment is successful?

Are you doing it through Eclipse?

 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
The deployment is successful. The Page is displayed correctly, but image is not getting displayed.
I have tried deployment both in eclipse (By Run As -> Run On Server) and by creating WAR file deploying manually on Tomcat.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Why did you change to scriptlets when the EL was emitting the right thing? Put the EL back and remove the scriptlets.

Do a View Source at the browser to see what the image src attribute contains. Does it match the URL that allows you to view the image from the browser bar?
 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I had changed to scriptlets try the suggestion of Prajakta. I have again changed it to EL.

Location of image file - C:\Work\contextroot\WebContent\image\cal.gif
Address (URL) from IE Properties - http://localhost:8080/contextroot/WebContent/image/cal.gif
EL - <img src="${pageContext.request.contextPath}/WebContent/image/cal.gif" alt= "No image available" width="150" height="40" border="0">
Browser View Source, Image Source value - <img src="/contextroot/WebContent/image/cal.gif" alt= "No image available" width="150" height="40" border="0">

These are details for the image file.

The URL http://localhost:8080/contextroot/WebContent/image/cal.gif also does not display image, it again comes to the same page where other details are displayed.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Anurag Bhardwaj wrote:I had changed to scriptlets try the suggestion of Prajakta.


That was poor advice.

Location of image file - C:\Work\contextroot\WebContent\image\cal.gif


You have a folder named contextroot and one named WebContent. Why is that? Which is really the context root? That's a really poor and confusing choice of folder structure.

Are you running this in eclispse or something like that? If so, that's a detail we need to know right off the bat.

 
Prajakta Acharya
Ranch Hand
Posts: 138
Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi Bear,

I had just put up my working set-up here. I agree that EL should be preferred.

In my web application set up through Eclipse, a Web Content folder is created by Eclipse and in the deployment process, all the contents of that folder are placed in the application folder directly.
So, images put under Web Content/image directory are deployed under <web app folder/image> by Eclipse installation.

 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
My apologies for confusion in folder names. Here the contextroot specifies application name. Actually the application name is NewDashboard.
The application has WebContent folder which has WEB-INF, image folders.

I changed the folder names from earlier webapps as it was confusing. The folder structure is -

-NewDashboard
--WebContent
--image
--WEB-INF

Location of image file - C:\Work\NewDashboard\WebContent\image\cal.gif
Address (URL) from IE Properties - http://localhost:8080/NewDashboard/WebContent/image/cal.gif
Browser View Source, Image Source value - <img src="/NewDashboard/WebContent/image/cal.gif" alt= "No image available" width="150" height="40" border="0">

I have tried these EL's but image is not getting displayed -

EL - <img src="${pageContext.request.contextPath}/WebContent/image/cal.gif" alt= "No image available" width="16" height="16" border="0">
EL - <img src="${pageContext.request.contextPath}/image/cal.gif" alt= "No image available" width="16" height="16" border="0">

When i View Source and in that i change image path to actual path on system (C:\Work\NewDashboard\WebContent\image\cal.gif) image is displayed.

Please let me know if some mistake is done and something is missing.


 
Prajakta Acharya
Ranch Hand
Posts: 138
Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Why is Web Content a part of URL? It should not be.

Have you tried this URL?
http://localhost:8080/NewDashboard/image/cal.gif
 
Anurag Bhardwaj
Greenhorn
Posts: 12
Eclipse IDE Spring Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Yes, URL http://localhost:8080/NewDashboard/image/cal.gif also does not display image, it again comes to the same page where other details are displayed.
 
Bear Bibeault
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Stop! Just stop! You're just making it all a mess!

Answer the following questions:
  • Are you running this in eclispe or another IDE. Yes or no?
  • What folder is configured as the context path? It should be the one containing WEB-INF.


  • Until we know that, doing anything else is useless.
     
    Anurag Bhardwaj
    Greenhorn
    Posts: 12
    Eclipse IDE Spring Java
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    Qu: Are you running this in eclispes or another IDE. Yes or no?

    The application is developed and deployed using eclipse. eclipse is creating WebContent folder by default where WEB-INF, META-INF folders are placed. I have created image folder in WebContent folder.
    I have tried deployment both in eclipse (By Run As -> Run On Server) and by creating WAR file deploying manually on Tomcat.

    Qu: What folder is configured as the context path? It should be the one containing WEB-INF.

    NewDashboard folder as contextPath. When i run ${pageContext.request.contextPath} the value coming is /NewDashboard.


    I have tried these EL's but image is not getting displayed -

    EL - <img src="${pageContext.request.contextPath}/WebContent/image/cal.gif" alt= "No image available" width="16" height="16" border="0"> in this case - Address (URL) from IE Properties is - http://localhost:8080/NewDashboard/WebContent/image/cal.gif
    EL - <img src="${pageContext.request.contextPath}/image/cal.gif" alt= "No image available" width="16" height="16" border="0"> in this case Address (URL) from IE Properties - http://localhost:8080/NewDashboard/image/cal.gif

    Both these case image is not getting displayed using URL coming in IE Properties (http://localhost:8080/NewDashboard/WebContent/image/cal.gif , http://localhost:8080/NewDashboard/image/cal.gif )

     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Here's my advice: ditch eclipse as the container. I think it's fine to use an IDE such as eclipse as a smart editor (I use IntelliJ), but I've always found that trying to run a web app from the IDE introduces more complexity than it solves. The addition of the senseless and superfluous WebContent folder is a good example.

    My advice: structure the app simply, and make sure that your images folder is in the web context folder (the one with WEB-INF) and that you don't need to include any other ridiculous, superfluous folder such as WebContent in your URLs. Your URL should end up being /context-path/whatever.

    If you want to continue using eclipse as the execution platform, let me know and I will move this to the IDEs folder because the problem is in the eclipse project, and not a general JSP issue.
     
    Anurag Bhardwaj
    Greenhorn
    Posts: 12
    Eclipse IDE Spring Java
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Thanks Bear.

    I have downloaded IntelliJ and trying to get hold of it, but it would be nice to get a solution from eclipse also.

    Please help in moving this to the IDEs folder.
     
    Bear Bibeault
    Sheriff
    Posts: 67746
    173
    Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    My point in mentioning IntelliJ is not that it will solve your problems (though I do think it is a better IDE) but just pointing out that I use an IDE as a "smart editor", but run the web apps separately in standalone Tomcat instance. That gets config and limitations of the IDE out of my hair, and I never, ever, ever, run into these kind of issues.

    I've moved this to the IDEs forum for you. Good luck.
     
    Anurag Bhardwaj
    Greenhorn
    Posts: 12
    Eclipse IDE Spring Java
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    Hi

    I am still having the problem. Can someone from IDE help.
     
    Sheriff
    Posts: 10445
    227
    IntelliJ IDE Ubuntu
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator

    ${pageContext.request.contextPath}/WebContent/image/cal.gif



    Why do you have the word "WebContent" in there? Like Bear has been trying to explain, all this is unnecessary complexity due to the IDEs. All you need is the resource to be available within the deployed application and based on what you have said so far, the URL should be ${pageContext.request.contextPath}/image/cal.gif.
     
    Anurag Bhardwaj
    Greenhorn
    Posts: 12
    Eclipse IDE Spring Java
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    My Folder structure is -

    -NewDashboard
    --WebContent
    --image
    --WEB-INF

    I have also tried moving image folder under "New DashBoard"

    I have tried this EL but image is not getting displayed -

    EL - <img src="${pageContext.request.contextPath}/image/cal.gif" alt= "No image available" width="16" height="16" border="0"> in this case Address (URL) from IE Properties - http://localhost:8080/NewDashboard/image/cal.gif

    Both image is not getting displayed using URL coming in IE Properties (http://localhost:8080/NewDashboard/image/cal.gif )

     
    Jaikiran Pai
    Sheriff
    Posts: 10445
    227
    IntelliJ IDE Ubuntu
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    I have no clue about how IDE treats the WebContent folder. One thing you could try is to move that image folder and its contents to *inside* the WebContent folder. Don't do any other changes, leave WEB-INF where it is now. Like this:


    Finally, stick with this URL ${pageContext.request.contextPath}/image/cal.gif. See if that works.

    P.S: If you are new to web development, which I think you are, you should really keep out the IDE from the equation. It's just frustrating to see all this unnecessary mess.
     
    Anurag Bhardwaj
    Greenhorn
    Posts: 12
    Eclipse IDE Spring Java
    • Mark post as helpful
    • send pies
      Number of slices to send:
      Optional 'thank-you' note:
    • Quote
    • Report post to moderator
    I have moved image folder under WebContent and tried - ${pageContext.request.contextPath}/image/cal.gif

    Image is still not displayed.
     
    Don't get me started about those stupid light bulbs.
    reply
      Bookmark Topic Watch Topic
    • New Topic