Uploading image to folder & imagepath to database using JSP


Files can be uploaded in multipart/form-data and by doing that the input fields will go null if we use request.getParameter

 To avoid that problem

 Here we have used Apache library for handling file upload together with input fields

  • For this two jars are required: commons-fileupload-1.2.1.jar, commons-io-1.4.jar
  • Download this jars from following link

http://commons.apache.org/fileupload/download_fileupload.cgi

Put this jars file into “WEB-INF\lib” and “C:\Program Files\Java\jre1.6.0\lib\ext”  also.

  • Write (enctype=”multipart/form-data”) in JSP or HTML Page within <form> tag.
<html>
<body>
<form name="form1" method="post" enctype="multipart/form-data" action="insertimage.jsp">

<p>
<input type="file" name="ImageFile" id="ImageFile" />
</p>
<p>
<input type="submit" name="submit" value="submit" />
</p>
</form>
</body>
</html>

Here, I have include  “getcon.jsp” in “insertimage.jsp” page to connect a databse in mysql. You can use different database.

code for getcon.jsp

<%@ page import="java.sql.*" %>
<%!Statement st=null;
Connection cn=null;
%>
<%
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
cn=DriverManager.getConnection("jdbc:odbc:data","root","");
<!-- database name= data, username=root, password=blank-->
st=cn.createStatement();
%>

Code for insertimage.jsp

<%@ page import="org.apache.commons.fileupload.servlet.ServletFileUpload" %>
<%@ page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
<%@ page import="org.apache.commons.fileupload.*"%>
<%@ page import="java.util.*, java.io.*" %>
<%@ page import="java.util.Iterator"%>
<%@ page import="java.util.List"%>
<%@ page import="java.io.File"%>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="getcon.jsp"%> <!-- to connect a database-->

<%
try
{
String ImageFile="";
String itemName = "";
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
if (!isMultipart)
{
}
else
{
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
List items = null;
try
{
items = upload.parseRequest(request);
}
catch (FileUploadException e)
{
e.getMessage();
}

Iterator itr = items.iterator();
while (itr.hasNext())
{
FileItem item = (FileItem) itr.next();
if (item.isFormField())
{
String name = item.getFieldName();
String value = item.getString();
if(name.equals("ImageFile"))
{
ImageFile=value;
}

}
else
{
try
{
itemName = item.getName();
File savedFile = new File("config.getServletContext().getRealPath("/")+"Example\\image-folder\\"+itemName);
item.write(savedFile);
}
catch (Exception e)
{
out.println("Error"+e.getMessage());
}
}
}
try
{
st.executeUpdate("insert into test(image) values ('"+itemName+"')");

}
catch(Exception el)
{
out.println("Inserting error"+el.getMessage());
}
}
}
catch (Exception e){
out.println(e.getMessage());
}
%>

After inserting image Path  into database retrieve image by following JSP code…..

</span>

<%@ include file="getcon.jsp"%>
<html>
<head>
<title>View Image Page</title>
</head>
<body>
<table width="100%" border="0">
<!-- main content -->
<%
ResultSet rs=null;
try
{

rs=st.executeQuery("select image from test");

while(rs.next())
{
%>
<table width="70%" height="160" border="1" align="center">
<tr>
<!-- Mention Directory where your images has been saved-->

<td><img src="image/<%=rs.getString("image") %>" width="115" height="128" /></td>
</tr>
</table>
<%
}
}
catch(Exception e)
{
out.print(""+e.getMessage());
}
%>

</table>
</body>
</html>
<pre>

finally execute your code …………….♣

About these ads

80 Comments (+add yours?)

  1. sai prajeeth
    Jul 17, 2014 @ 13:54:15

    getting error at this line
    boolean isMultipart = ServletFileUpload.isMultipartContent(request);

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: