Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Show multiple images in JSP page

Status
Not open for further replies.
abc73

abc73

Programmer
Apr 28, 2004
89
0
0
US
I have an Application in which I am showing images in a jsp page from a Database. It takes forever to load over 400+ images and sometimes it only shows half and the rest just small boxes.

I have a bean in which I get the imagenames from DB based on the query and stores in a hashtable then inside a JSP page I have a for loop that calls a servlet passing an image-name a time and the servlet returning the jpeg image.

Is there a way to show 25 images a time and NEXT and PREVIOUS buttons so the user can move arround. Can someone tell me how to implement this functionality as I don't want to show all the images once and rather show in a junk i.e. 25 images a time. Any help is really appreciated.

Thanks.
 
Sort by date Sort by votes
Hi,

But I suggest you to read the required number of images at a time insted of reading and loading all the images into a Hashtable at time.

Cheers

 
Upvote 0 Downvote
I looked into the thread but I am getting Images from database and it can be huge number of them. So don't know if it's wise to store them in an ArrayList. As I haven't used the taglibs before so believe there's a learning curve but I don't have enough-time. I am hoping if I can atleast tweak my current code a little and make it functional and mean-time can continue looking into taglibs. Here is a sample snippet of the code and current scenario:

It takes forever to load over 400+ images and sometimes it only shows half and giving an error "Ranout of Virtual Memory" and the rest of the images just small "X" .
Code: 
<%@ page contentType="text/html;charset=windows-1252"%>
<%@ page import="java.util.*" %>
<jsp:useBean id='image' scope='application' class='MYForm.Images'/>
<% image.dbConnection() %>
<html->
  <head->
    <meta- http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title->untitled</title->
  </head->
  <body valign=center->
  
  <%
	String imgName = request.getParameter("Name");
	String imgId = request.getParameter("Id");
	String imgacc = request.getParameter("acc");
	Hashtable imagenames = image.getNames(imgName, imgId, imgacc);
	//I am calling the bean method passing the above values to get all the image names from a
	//DataBase that don't match the above criteria. A hashtable with image names is returned by a bean.
 
	//Here I check if Hashtable is not empty and then proceed as follows....
	..................
	.................
	enum = imagenames .elements ();
        while(enum.hasMoreElements ())
        {
           s = (String) enum.nextElement ();
  %>
        
            
<!-- calling a servlet with the imagename to show the image-->		
<-img src="servername:port/contextpath/servlet/getImage?imgname=<%= s %> width=640>
            
        
  <%
      }
      
      //here I do some clean-up that is close any DB connections if open, etc..
      ...........
      .............
      session.invalidate();
      
     //Now if I have 1000 images I am calling a servlet thousand times that in-turn hits the DB to retreive the image
     //but this process is very slow and that's why half the image show and the rest half doesn't giving VM error.
  %>	 	 
      
  </body->
</html->

Any help is really appreciated.
Thanks
 
Upvote 0 Downvote
Hi,

If you are storing just the image names in Hashtable it will not use much of memory. But what does this line of code does
<-img src="servername:port/contextpath/servlet/getImage?imgname=<%= s %> width=640>

Does it return you output stream?

If your showing the images which are part of your webapplications then you can always use
<img src="<%=s%>"/> where "s" is the file name. This should be fast enough. until the image are of bigger size.

Cheers
Venu
 
Upvote 0 Downvote
In the following line I am passing an image name a time to a servlet that returns me the image and I am showing it in a page. If I have 500 image-names in the hashtable the following line will execute 500 times. Here is what I am doing.
Code: 
.....................
..................
while(enum.hasMoreElements ())
{
    s = (String) enum.nextElement ();
%>
   <tr>
	<td align="center" width="90%">
   <img src="servername:port/contextpath/servlet/getImage?imgname=<%= s %> width=640>
        </td>
   </tr>
<%
}
.......
..........
%>

Actually I have form where a user inputs the search criteria and based on that all images are to be shown. The search can return 1 or 10 or 500 or any number of images and then I show them in a table. The image size also vary can big or small. But there's a performance issue so would like to show 25 images a time and add PREVOIUS & NEXT buttons. Any help is really appreciated.

Thanks




 
Upvote 0 Downvote
Hi,

Read the Comments and change them as per your requirement.

Code: 
<%@ page import="java.util.ArrayList,
                 java.util.Iterator,
                 java.util.List,
                 java.util.Hashtable"%>
<%
    ArrayList arrayList = null;

    /* Start of comments that need to removed */
    Hashtable hashtable = new Hashtable(50);
    for(int i=0; i<50 ; i++)
    {
        hashtable.put(i+"","Image Name"+i);
    }
    arrayList = new ArrayList(hashtable.values());
    /* End of Comment code that needs to be removed */

    // UNCOMMENT BELOW CODE
    /*
     if(null != request.getParameter("Name"))
     {
       //Get the Hashtable from the DB if requestParameter is null
       Hashtable imagenames = image.getNames(imgName, imgId, imgacc);
       //Get the values from Hashtable and store it in ArrayList
       arrayList arrayList = new ArrayList(imagenames.values());
      //Store the ArrayList into session Object so that you can avoid DB calls from second call to the same page
       session.setAttribute("arrayList", arrayList);
     }else{
      // get the ArrayList from session
        arrayList = (ArrayList)session.getAttribute("arrayList");
     }
     */

    boolean check = true;
    int arrayListSize = arrayList.size();
    // Number of Records that need to displayed per page
    // make the increment value 5 and check it will display only 5 records per page
    int increment = 2;
    int fromIndex = 0;
    int toIndex = increment;
    String uri = request.getRequestURI();
    String previous= "Previous";
    String next = "Next";
    List displayList = null;
    if( null != request.getParameter("next"))
    {
        fromIndex = Integer.parseInt(request.getParameter("next"));
        toIndex = increment + fromIndex;
        if( toIndex+1 > arrayListSize)
        {
            toIndex = arrayListSize;
            check = false;
        }
        if( fromIndex > arrayListSize)
            fromIndex = 0;
    }

    if( null != request.getParameter("prev"))
    {
        toIndex = Integer.parseInt(request.getParameter("prev"));
        fromIndex = toIndex - increment;
    }

   if(arrayListSize > 0)
    {
      if(increment > arrayListSize){
        toIndex = arrayListSize;
        displayList = arrayList.subList(fromIndex, toIndex);
        toIndex = 0;
      }else{
          displayList = arrayList.subList(fromIndex, toIndex);
      }
   }
    if(fromIndex != 0)
       previous = "<a href="+ uri +"?prev="+ fromIndex +"> Previous </a>";
    if(toIndex != 0 && check)
       next = "<a href="+ uri +"?next="+ toIndex +"> Next </a>";

    out.println("Total Size of ArrayList is " + arrayListSize);
    out.println("<br>");
    //out.println(displayList);

   /* out.println("<br>");
    out.println(next);
    out.println("<br>");
    out.println(previous); */
%>

<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="43%" id="AutoNumber1">
 <caption><%=arrayListSize%></caption>
  <tr>
    <td width="53%">
    <p align="center"><%=next%></td>
    <td width="47%">
    <p align="center"><%=previous%></td>
  </tr>
  <% Iterator iterator = displayList.iterator();
    while(iterator.hasNext()){
        String s = iterator.next().toString();
  %>
   <tr>
    <td width="100%" colspan="2"><img src="servername:port/contextpath/servlet/getImage?imgname=<%=s%>" width="640"></td>
   </tr>
   <%
    }%>

</table>

cheers
Venu
 
Upvote 0 Downvote
Thanks Venu I'll try this and will let you know. Thanks again.
 
Upvote 0 Downvote
I have one concern if I add my ArrayList to session is there a possibilty of loosing a session, and how do I make sure my session remains valid.
 
Upvote 0 Downvote
Hi,

If you are concern about the session put an extra condition which checks for arrayList in session, if it does not exists
1) DB
2) Get Hashtable
3) Store the arrayList into session.

But u need to store the request Parameters as hidden parameters.

Cheers
Venu

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

hopecila
  • Locked
  • Question
jsp servlet ejb
Replies
1
Views
68
Diancecht
Diancecht
vanimca
  • Locked
  • Question
Registration page with take picture in webcam snapshot in java
Replies
1
Views
74
Diancecht
Diancecht
rach18
  • Locked
  • Question
Problem with executing ssh in JSP
Replies
1
Views
78
Diancecht
Diancecht
capellone2
  • Locked
  • Question
Set form property in jsp
Replies
1
Views
71
Diancecht
Diancecht
HemanthaNet
  • Locked
  • Article
Suppose to develope the Tender post project in Srping MVC
Replies
0
Views
57
HemanthaNet
HemanthaNet

Part and Inventory Search

Sponsor

Back
Top