• 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

show table with text and image, both from database

 
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
hi,
I cant show text and images - both - like result from servlet from database.
I am trying obey the MVC.
I have two tables: one about text (ID, name, email); another table about image (png).
I need: a JSP with bottom to order to action the servlet; a servlet to order get the text and image from tables from database(postgresql); and another JSP showing the result from servlet through a table like this:

img_java.png
[Thumbnail for img_java.png]
table
 
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
What's the issue? Text is easy -- just use the usual MVC pattern for it.

The image is a little more involved: use an image tag like any other image, but the src should point to a servlet that reads the image data and returns a response with the appropriate headers and body. Search this forum for previous topics on this subject.
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
the issue: servlet apparently doesnt allow show both (text and image).
the "setcontenttype" has to be "text/html" OR "image/png".
so, I dont know how to show a table like above. (the table is not only those rows. there are several rows. the type of image are several types: gif, png, jpg, jpeg).
so I have no ideia how to do.
 
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
I repeat:

The HTML (whether generated from a servlet or not) is still HTML. You show an image using an img tag. That doesn't change. Just because you are using servlets doesn't change the rules of HTML.

The img tag references another servlet that just returns the image data.


 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
and how is the code of servlet and jsp-table? if the database has 1000 images (photos) with several types (png, gif, etc), how will be the code of jsp receiving those photos? there will be 1000 servlets with 1000 images?
 
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
Think about it. Why would you need more than one image servlet? The data is an a database table, right?

So how could you pass information to the servlet telling it which data to retrieve?
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I ve no ideia. others programming languages dont have this "limitation" to show text and image at once.
in the servlet, or put or but not both.
 
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

ronald silva wrote:I ve no ideia. others programming languages dont have this "limitation" to show text and image at once.


For better or worse, when dealing with the web, you use HTML. And in HTML, the image is not mixed with the text. Rather, the HTML markup references the image separately via the img tag.

or but not both.



Again, you never send both at the same time. This has nothing to do with servlets, or even Java; it's the way HTML works. See above.

So you have a servlet that generates the HTML, which contains an img tag that references another servlet that returns the image response. This is no different than any other image in HTML where the img tag references an image file.

The url that references the image-serving servlet can include information in request parameter(s) (such as database id values) that tell the servlet which data to retrieve from the database and return as the response.
 
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
P.S. There is a notation in which image data (encoded in base64) con be included directly in the HTML, but its use is not generally recommended.
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
the database dont storage the url or path of image.
the database only storage the image (file).
so, in table I have the name, email, id.
and another table, the photo.
how show both?
and each user has a photo.
it is a list of employess.

 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
store*
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
data image encoded base64 could works... I will research it.
so I could send image-encoded-base64 and the other data at once to JSP?
the html-jsp decode this image and show the photo?
 
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
Yes, but it's not the recommended approach because the images cannot be cached and the size of the HTML can get very very large if there are numerous images.
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
is it a failure of java/servlet?
it would be so easy if I can  do:
SELECT id, name, email, image FROM mytable
and show the table above...
 
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

ronald silva wrote:is it a failure of java/servlet?


No. As I have repeatedly said, all of this stems from how HTML works.

it would be so easy if I can  do:
SELECT id, name, email, image FROM mytable
and show the table above...


I thought that you said that the image was in a different table?
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
yes, two tables.
I have just meant it would be easier to do like this....
 
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
Regardless, the right way to do this is as I've explained before:

1) One servlet (not using JSP at all?) produces the main HTML page which contains the display table and all the text data. And in the last column it has an <img> tag for the image.

2) The src of that img tag is the URL of a servlet with request parameter(s) that identify the right image (likely a database id)

3) The image servlet reads the image data from the db, and serves it with the appropriate content headers.

And again, this is all about HTML, not about Java, not about servlets.
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I guess what you say maybe works if only one row in database.
but doesnt work to several rows in database

see:
 
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

ronald silva wrote:I guess what you say maybe works if only one row in database.
but doesnt work to several rows in database


Hogwash. What makes you think this?


<img src=" [no ideia put here. it will be several images... so it will be several servlets_getting_images_from_database...]


No. One servlet. The src URL for the image references that servlet and includes information in request parameters that tell the image servlet how to fetch the relevant single image from the database.

Why are you hung up on several images? Your mockup in the first post shows a single image per row. Each row would have its own img tag, each with a reference to the image servlet and the unique database id of the image as a request param.
 
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
E.g.
and in another row:
Imagine that 213 and 214 are the primary keys for the database rows.

One servlet that can serve up any image from the database.
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
you thinking about a retrieving of a "fixed" image.
but the retrieving is dinamic.
for example: the user fill the form put the "id" (key of database).
the servlet receives this information and conects to database. the database send the row with text-data.
the same with image.
the servlet does the out.println with table with dat-text (like the code above).
but HOW I change the "id" in the code "

how the number (id) will change conforming the id- typed by user in the form?
or I can to do like this:?
 
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

ronald silva wrote:you thinking about a retrieving of a "fixed" image.
but the retrieving is dinamic.


No. I'm not. I do this all the time. There is nothing "fixed" about what I am discussing.

(By the way, "dynamic")

but HOW I change the "id" in the code "


That depends on how your database schema is set up. I assume that the row containing the text data has a column that relates it to a corresponding row in the image table? If not, how do they relate? If so, then that foreign key id value is what you would pass to the servlet so that it knows what image row to read and return.

Maybe it would be best to post the DDL for your two tables here? Or the beans you are using to capture the data?
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
you didnt understand.
in the code <img src="/contextPath/servlet-name?imageId=213"> I need to put a variable in the place of number (dynamically).
I dont know how do I would do...

 
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
In the following example from your code:
you include dynamic values in the HTML. Why would the id value for the image be any different?
 
ronald silva
Ranch Hand
Posts: 34
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
if the image is coming from another servlet, I need include this servlet, dont I?
you said: <img src="/contextPath/servlet-name?imageId=213">
but the number changes as per the ID of user.
so I dont know change the number dinamically.
puttin the name of servlet in this table, it is enough to display the image?
remember: une servlet brings the data-text from database.
another servlet brings the image.
I need display both all at once. (in only table).
 
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

ronald silva wrote:
so I dont know change the number dinamically.



The same way you are including any other dynamic information.

E.g.


Substitute e.getImageId() with however you get the image id from the employee record.

By the way, e is a horrible variable name. Use employee when the variable represents an employee.
 
It's feeding time! Give me the food you were going to give to this tiny ad:
a bit of art, as a gift, the permaculture playing cards
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic