?
Solved

How to upload allow user select their image file and upload into database?

Posted on 2003-02-25
73
Medium Priority
?
1,253 Views
Last Modified: 2007-12-19
I have created javabean for connection and a few other javabeans such as dbHobby and dbMemeber, which make use of the connection javabean. dbHobby will have prepared Statement that perform insert, delete, edit or select values into or from Hobby table, same as for dbMember.
For now, i am creating a website, my database is mysql.
Can anyone teach me how can i enable user to click browse, then they can select their img file from their own computer, and upload and store the image into mysql database?
And from my database, how can i retrieve the image and display it into my jsp?
I heard of something such as blob, but really dont know how to code it. Will appreciate if someone can provide me some sample coding for uploading of image.
I am still trying to learn java as i have just pick this language up on my own for quite a short period only. Hope you experts out there can kindly help me. Thanks
0
Comment
Question by:iCeFiRe
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 40
  • 14
  • 13
  • +3
73 Comments
 

Expert Comment

by:Brcko
ID: 8026246
question to you
why you want store images in DB?

better is store images on disk and in db store only path to image.

but if you really want to store image in db

1. create ServletInputStrem
2. read bytes[] from ServletInputStream
3. create updateable ResultSet
4. ResultSet.setBlob("BLOB_NAME").setBytes(bytes[])

for displaying you've got 2 choices

A. store image to disk
1. create ResultSet
2. bytes[] = ResultSet.getBlob("BLOB_NAME").getBytes();
3. create FileOutputStream
4. FileOutputStream.write(bytes[])
5. write <IMG /> to html page

B. send image directly from DB
create page that returns image
1. create ResultSet
2. bytes[] = ResultSet.getBlob("BLOB_NAME").getBytes();
3. change ContentType of page to image
4. write bytes[] to output
create display page
1. <IMG src="path_to_page_that_returns_image?with_some_params_be_file_name">
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8026359
look for jspSmartUpload at http://www.jspsmart.com/ , it does exactly what you want to do and is free.
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8026361
let me know if you have further enquiries.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 19

Expert Comment

by:cheekycj
ID: 8026461
I agree with Brcko, just store the image paths and upload the images.

That is better than storing the images as Blobs (binary data) in the DB.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8030019
OK, actually i have though of storing the image paths, but i have to follow my supervisor requirement as i am only a student under attachment period, helping the company to create website, so i dont really have freedom to do whatever i like.
i found a few free to use jsp upload class, but i need to code the upload code into my javabean. those free one doesnt have code for me to read about.
My sup wants me to put everything in mysql database. If storing path name will need to create a directory outside the mysql database, that isnt what so what, so i gotta do it in blobs. But really got no idea how to do it. Cause i am really new to java, and just know some basic programming. Thanks for your advice guys.
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8030053
>> My sup wants me to put everything in mysql database
jspSmartUpload is free and does all this for you:

Your very own JSP component to manage uploads to and downloads from your web sites – FREE !!
+ upload 1 or more files to the server
+ upload to a database
+ control the upload file by file
+ manage mixed forms : files + form fields
+ download a file
+ download a database field
+ restrict file size, extension etc.
+ MacBinary support

+ Platform : Apache, NT, Unix, Linux, IIS...
+ Databases : MySQL, Oracle...
0
 

Author Comment

by:iCeFiRe
ID: 8031166
but jspSmartUpload is just like, i import all those file into my tomcat(i am using tomcat 4.1.18)
then change and make use of the coding, i can upload right?
but i think i need to write my own code and functions. i cannot make use of these kind of files.
0
 

Author Comment

by:iCeFiRe
ID: 8031382
Let's say if i have a "browse" button in my jsp, how can i code it when user click the button, it will enable user to select the file from their disk?
and for the upload and retrieve part, sorry kennethxu, i dont really understand it still.
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8034371
>> helping the company to create website.
So I asume you are on a real project instead of homework.

>> but i think i need to write my own code and functions. i cannot make use of these kind of files.
than, why must re-invent the wheel?

>> then change and make use of the coding, i can upload right?
you need to config it to work with your database. you can customized your user interface.

>> and for the upload and retrieve part, sorry kennethxu, i dont really understand it still.
this is handled by broswer, all you need is html code like this:
<FORM ENCTYPE="multipart/form-data" ACTION="upload.jsp" METHOD=POST>
   File to process: <INPUT NAME="userfile1" TYPE="file">
   <INPUT TYPE="submit" VALUE="Send File" >
</FORM>


try out jspSmartUpload and samples come with it. if you hit specific problem during installation or trying out samples, let us know.
0
 

Author Comment

by:iCeFiRe
ID: 8069371
i am a student actually. Now under attachment period.
Cause i am using javabean. And my company is asking me to create it. So i think it is better for me if i can write the code inside my javabean.
And for the hmtl part. I am not sure how user can press broswe, then user can choose their files to upload.
Thanks
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8072574
as kenneth indicated, input type file will create a form element (in HTML) that will allow the user to browse and select a file.

then you must submit it to your servlet that will call your bean to do the upload.

CJ
0
 
LVL 28

Expert Comment

by:rrz
ID: 8072597
>And for the hmtl part. I am not sure how user can press broswe  
Kenneth posted that above.  
>And from my database, how can i retrieve the image and display it into my jsp?  
Look at  
http://www.experts-exchange.com/Web/Web_Languages/JSP/Q_20538763.html 
you can use a HTML image tag on your JSP to call the servlet  
>if someone can provide me some sample coding for uploading of image.
If you really don't want to use Kenneth's link,
then you you could use JavaMail and Activation jars.
Do you want to use those ?
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8073204
I have seen similar question coming up, it's more like homework :) if it is homework, we can guide you but we cannot give you the code.
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8073964
a new question in this TA has a user using an upload bean from:
http://www.javazoom.net/jzservlets/uploadbean/documentation/index.html

check it out.. It looks promising.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8076372
Ok, it is not homework for sure. haha...but thanks guys, i already have done my javamail. now still having some problem with a small part of functions. Thanks
0
 
LVL 28

Expert Comment

by:rrz
ID: 8076762
Please share your code.
0
 

Author Comment

by:iCeFiRe
ID: 8076777
What code?
0
 
LVL 28

Expert Comment

by:rrz
ID: 8076822
> i already have done my javamail.
I thought you had coded solution.
0
 

Author Comment

by:iCeFiRe
ID: 8076982
Ya, i have done my javamail. I found it online. You need the code?
0
 

Author Comment

by:iCeFiRe
ID: 8076990
<%@ page import="java.util.*, javax.mail.*, javax.mail.internet.*" %>
<%
  Properties props = new Properties();
  props.put("mail.smtp.host", "");
  props.put("mail.transport.protocol", "smtp");
  Session s = Session.getInstance(props,null);

  MimeMessage message = new MimeMessage(s);

  InternetAddress from = new InternetAddress("");
  message.setFrom();
  InternetAddress to = new InternetAddress("miniwa@hotmail.com");
  message.addRecipient(Message.RecipientType.TO, to);
 
  message.setSubject("");
  message.setText("");

  Transport.send(message);
%>
<html>
<p align="center">A Message has been sent.<br>Check your inbox.</p>
<p align="center"><a href="sendmail.jsp">Click here to send another!</a></p>
</html>
0
 
LVL 28

Expert Comment

by:rrz
ID: 8077018
I was suggesting that you  use the classes in the JavaMail package for file upload see  
 javax.mail.internet.MimeMultipart
0
 

Author Comment

by:iCeFiRe
ID: 8077034
ERm...Dont really get it
sorry.
I still have no time to try out the uploading coding. As i am busying with other stuff for the moment.
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8081620
keep us posted.  Try out the bean, it may make it easier for you.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8200160
sorry guys, will assign point later when i have time to deal with this problems, sorry about it. cause i have been busy with some stuff, may need to ask question again, so hope can keep this topic open first. is it ok for you guys?
really really sorry about it.
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8202717
fine by me :-)

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8202976
thanks!
you guys are great!
0
 

Author Comment

by:iCeFiRe
ID: 8209108
guys, i have another question.
let's say, if i just want to store the path of the image file into a folder.
how should i do it?
in the html there still use that browse you all have mention right?
and if i want to write a function to create a folder. may i know how to do it?
i want to do something like, when user click submit to upload the picture.
i can create a folder, and stored the picture inside the folder. and then, store the path of picture in database.
may i know how to do it?
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8210942
To create a directory do this:
java.io.File fileDir=new java.io.File("/path/to/your/new/dir");
fileDir.mkdir();

use one of the upload bean options above to upload the image to the directory.

then just store the image path in the DB.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8214726
oh, that means, even i must use those upload bean in order to allow user to save the image file into my server folder?
0
 

Author Comment

by:iCeFiRe
ID: 8216564
and how to limit user to select only image file?
when user click browse?
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8217976
yes it would be easier than writing your own bean.

one <input type=file> will allow only one entry.

they can't select multiple files.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8221915
can i use 2 <input type=file> in a form?
inserting into 2 different fields.
so what i have to do is to make use of those already avaible bean online, like those you all guys recommend me?
cause for now, i only have to store the image path name only.
so those bean will help to store the image in my database, or a folder in my hdd?
sorry, this question sound dumb, but really need helps from you guys
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8225492
if you have two input type file fields than the user can upload two files.

use the bean for each file.

the bean will store the file(s) in a folder on your server.

you store the path to the file in the DB.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8235801
so is there any upload bean u can recommend me on?
is this one fine?
http://www.javazoom.net/jzservlets/uploadbean/uploadbean.html#download
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8235805
that one looks good, Others here have used it.  Try it out.

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8235835
what should i use to retrieve the file name?
in the processupload.jsp?
i seem to have some problem with retrieving values from page.
java.lang.NullPointerException
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8235842
>> so is there any upload bean u can recommend me on?
So you decided to go with existing implemention eventually, I suggested you to try widely used jspsmartupload in the very first. day :)
0
 

Author Comment

by:iCeFiRe
ID: 8235884
sorry kennethxu.
It's not that i dont wish to listen to your advise, well, i understand that your advise will be more suitable for me. but as i am just a attachment student helping the company to build a web site, i dont really have freedom to code the way i wish to. And for now, my supervisor then allow me to use this. So really sorry about it. anyway, thanks alot guys.
0
 

Author Comment

by:iCeFiRe
ID: 8235897
for my post.jsp
i contain other html elements such as textboxes, dropdown listbox.
May i know how can i retrieve these values in my process.jsp?
i encounter java.lang.NullPointerException
0
 

Author Comment

by:iCeFiRe
ID: 8236067
is that possible for me to do something like
<jsp:setProperty name="upBean" property="folderstore" value="C:\Program Files\Apache Group\Tomcat 4.1\webapps\de-conexion\uploadImg\<%itemId%>" />
??
0
 

Author Comment

by:iCeFiRe
ID: 8236154
is that possible for me to do something like
<jsp:setProperty name="upBean" property="folderstore" value="C:\Program Files\Apache Group\Tomcat 4.1\webapps\de-conexion\uploadImg\<%itemId%>" />
??
0
 

Author Comment

by:iCeFiRe
ID: 8236158
ok, the upload part is fine. but i still cant get the part how to retrieve other values from the form, i used the upload bean, follow and edit the example. and it works.
but for this form, i need to insert the path name into the database. may i know how can i get the path name and other html values from this form?
sorry for being so naggy
0
 

Author Comment

by:iCeFiRe
ID: 8236173
and beside that. sorry, i have read that example mulitpleUploads.jsp
and simpleUpload.jsp
but they need to have <input type="hidden" name="todo">
in order to perform upload of image. why is that so?
can anyone please explain it to me?
0
 

Author Comment

by:iCeFiRe
ID: 8236223
and beside that. sorry, i have read that example mulitpleUploads.jsp
and simpleUpload.jsp
but they need to have <input type="hidden" name="todo">
in order to perform upload of image. why is that so?
can anyone please explain it to me?
0
 

Author Comment

by:iCeFiRe
ID: 8236355
and beside that. sorry, i have read that example mulitpleUploads.jsp
and simpleUpload.jsp
but they need to have <input type="hidden" name="todo">
in order to perform upload of image. why is that so?
can anyone please explain it to me?
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8238400
to retrieve html form elements just use this:

<%
  String field1Value = request.getParameter("field1");
%>

I am not sure about the hidden "todo" field but I am sure there is a reason for it.

I don't think
<jsp:setProperty name="upBean" property="folderstore" value="C:\Program Files\Apache Group\Tomcat 4.1\webapps\de-conexion\uploadImg\<%itemId%>" />
will work.

try this:
<jsp:useBean id="upBean" scope="page" class="javazoom.upload.UploadBean">
<% upBean.setFolderstore("C:\Program Files\Apache Group\Tomcat 4.1\webapps\de-conexion\uploadImg\" + itemId);
%>

CJ
0
 

Author Comment

by:iCeFiRe
ID: 8242951
ya i did use
<%
 String field1Value = request.getParameter("field1");
%>
but it is not working
and if i wish to retrieve the file name that user had broswe and put in the <input type=file>
how can i do tat?
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8242974
>> String field1Value = request.getParameter("field1");
it won't work, when you use multipart form data encoding.

use this:

         MultipartFormDataRequest mrequest = new MultipartFormDataRequest(request);
         String todo = mrequest.getParameter("field1");

0
 

Author Comment

by:iCeFiRe
ID: 8243029
i dont really understand the todo part
well. why is that that i have 2 <input type=file>
but i only need to perform one
<%
      if (MultipartFormDataRequest.isMultipartFormData(request))
      {
         MultipartFormDataRequest mrequest = new MultipartFormDataRequest(request);
         String todo = mrequest.getParameter("todo");

                // Uses the bean now to store specified by jsp:setProperty at the top.
                upBean.store(mrequest);
     }


%>

and then, both of my files will be upload?
and how can i retrieve other textbox values?
to insert into database?
and for the <input type="file">
how can i get the file names, so i can store thems ask image path into my database?
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8243049
>> upBean.store(mrequest);
this saves all the files that's been submitted.
0
 

Author Comment

by:iCeFiRe
ID: 8243415
oh, so it means that is my form have 2
<input type="file" name ="1">
<input type="file" name ="2">
then in my jsp that process upload, it will only able to retrieve values that is from html <input type="file">
but not <input type = "text">
or other such as dropdownlist, checkboxes?
0
 

Author Comment

by:iCeFiRe
ID: 8243512
oh, so it means that is my form have 2
<input type="file" name ="1">
<input type="file" name ="2">
then in my jsp that process upload, it will only able to retrieve values that is from html <input type="file">
but not <input type = "text">
or other such as dropdownlist, checkboxes?
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8246301
mrequest.getParameter("1");
mrequest.getParameter("2");

will get you the value of those fields.

CJ

0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8246308
>> but not <input type = "text">
>> or other such as dropdownlist, checkboxes?
for those type, you must use

        MultipartFormDataRequest mrequest = new MultipartFormDataRequest(request);
        String field1= mrequest.getParameter("field1");
        String field2= mrequest.getParameter("field2");

as I said in my previous posts.
0
 

Author Comment

by:iCeFiRe
ID: 8250253
oh. so i must use this
mrequest.getParameter("field1");
to retrieve my other html element values?
and for upBean.store(mrequest);?
if i have 2 files, then for my file, it's like
<input type="file" name ="1">
<input type="file" name ="2">
so can i do something like
MultipartFormDataRequest mrequest = new MultipartFormDataRequest(request);
       String file1= mrequest.getParameter("1");
upBean.store(file1);
       String file2= mrequest.getParameter("2");
upBean.store(file2);
you guys think will this work?
0
 

Author Comment

by:iCeFiRe
ID: 8250337
i am able to retrieve html elements values and store the file using upBean.store(mrequest);
but not
String file1= mrequest.getParameter("1");
upBean.store(file1);
      String file2= mrequest.getParameter("2");
upBean.store(file2);
but there's some problem, that is i am not able to retrieve the file name.
what can i do to retrieve the file name?
so i can store the image name into database as image path?
Sorry guys for asking so many questions.
0
 

Author Comment

by:iCeFiRe
ID: 8252341
when i use String file1= mrequest.getParameter("1");
to try to retrieve name of value of file1
i will have
java.lang.NullPointerException
even i have selected a file to upload.
0
 
LVL 14

Accepted Solution

by:
kennethxu earned 600 total points
ID: 8258517
the file name is get differently.

                Hashtable files = mrequest.getFiles();
                    UploadFile file1 = (UploadFile) files.get("1");
                    UploadFile file2 = (UploadFile) files.get("2");
                    String filename1 = file1.getName();
                    String filename2 = file2.getName();
0
 

Author Comment

by:iCeFiRe
ID: 8258558
but i am having this error
C:\Program Files\Apache Group\Tomcat 4.1\work\Standalone\localhost\de-conexion\jsp\processPostItem_jsp.java:137: cannot resolve symbol
symbol  : method getName ()
location: class javazoom.upload.UploadFile
             String photoName = itemPhoto.getName();

my code is like this
     Hashtable files = mrequest.getFiles();
             UploadFile itemPhoto = (UploadFile)files.get("itemPhoto");
             UploadFile itemThumb = (UploadFile)files.get("itemThumb");
             String photoName = itemPhoto.getName();
             String thumbName = itemThumb.getName();
should be fine right?
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8258582
sorry, should be getFileName()
0
 

Author Comment

by:iCeFiRe
ID: 8258587
but i am having this error
C:\Program Files\Apache Group\Tomcat 4.1\work\Standalone\localhost\de-conexion\jsp\processPostItem_jsp.java:137: cannot resolve symbol
symbol  : method getName ()
location: class javazoom.upload.UploadFile
             String photoName = itemPhoto.getName();

my code is like this
     Hashtable files = mrequest.getFiles();
             UploadFile itemPhoto = (UploadFile)files.get("itemPhoto");
             UploadFile itemThumb = (UploadFile)files.get("itemThumb");
             String photoName = itemPhoto.getName();
             String thumbName = itemThumb.getName();
should be fine right?
0
 

Author Comment

by:iCeFiRe
ID: 8258599
i get it done already!
thanks!
0
 

Author Comment

by:iCeFiRe
ID: 8258621
i am sorry guys, all of you guys really helped me alot.
special thanks to cheekycj. Thanks for your comments. Did really help. But because in the end, kennethxu's comments help me solve this problem. So i think to be fair, i should give the point to him. Sorry about this. Really appreicate you guys help.
Once again.
Thanks alot.
0
 
LVL 19

Expert Comment

by:cheekycj
ID: 8258787
No problem, just glad you got it working.

CJ
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8262330
I feel guilty to receive all points :)
iCeFiRe, is it OK for you to split points to CJ? if yes, I'll ask mod to fix this.
Thanks.
0
 

Author Comment

by:iCeFiRe
ID: 8266085
yup.
It's totally ok, if you dont mind about that kennethxu, it's all up to you.
But can i ask one more question?
is that possible for me to change the name of uploaded file?
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8266895
>> is that possible for me to change the name of uploaded file?
itemPhoto.setFileName( newname );
0
 

Author Comment

by:iCeFiRe
ID: 8266919
oh!
thanks alot!
0
 

Author Comment

by:iCeFiRe
ID: 8267957
sorry, kennethxu,
i am able to set a new file name
but, there is no more file extension.
is that possible to change only the file name. but keep the file extension?
0
 
LVL 6

Expert Comment

by:Mindphaser
ID: 8269462
cheekycj there is a question for you at http://www.experts-exchange.com/Web/Web_Languages/JSP/Q_20574316.html.

I am not taking away points that you earned in a honest way. The points of the new question come out of my pocket, so nobody gets hurt :-)

Keep up the good work folks!

** Mindphaser - Community Support Moderator **
0
 
LVL 14

Expert Comment

by:kennethxu
ID: 8269844
>>is that possible to change only the file name. but keep the file extension?
you need to get the orignal extension from getFileName()

String filename = file.getFileName();
String newfilename = "newname" + filename.substring( filename.lastIndexOf( '.' ) );
0
 

Author Comment

by:iCeFiRe
ID: 8281184
Thanks mindphaser, thanks kennethxu and cheekycj
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

An introduction to the wonderful sport of Scam Baiting.  Learn how to help fight scammers by beating them at their own game. This great pass time helps the world, while providing an endless source of entertainment. Enjoy!
In the absence of a fully-fledged GPO Management product like AGPM, the script in this article will provide you with a simple way to watch the domain (or a select OU) for GPOs changes and automatically take backups when policies are added, removed o…
In this video, Percona Director of Solution Engineering Jon Tobin discusses the function and features of Percona Server for MongoDB. How Percona can help Percona can help you determine if Percona Server for MongoDB is the right solution for …
In this video, Percona Solutions Engineer Barrett Chambers discusses some of the basic syntax differences between MySQL and MongoDB. To learn more check out our webinar on MongoDB administration for MySQL DBA: https://www.percona.com/resources/we…
Suggested Courses
Course of the Month10 days, 8 hours left to enroll

765 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question