index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jQuery File Upload Example</title> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" id="theme"> <link rel="stylesheet" href="fileupload/jquery.fileupload-ui.css"> </head> <body> <form id="file_upload" action="upload" method="POST" enctype="multipart/form-data"> <p id="drop_zone_1"> <input id="file_1" type="file" name="file_1" multiple> </p> <p id="drop_zone_2"> <input id="file_2" type="file" name="file_2" multiple> </p> <p id="drop_zone_3"> <input id="file_3" type="file" name="file_3" multiple> </p> <button>Upload</button> <table id="files_1" style="background:yellow;"></table> <table id="files_2" style="background:blue;"></table> <table id="files_3" style="background:orange;"></table> </form> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script> <script src="fileupload/jquery.fileupload.js"></script> <script src="fileupload/jquery.fileupload-ui.js"></script> <script> /*global $ */ $(function () { var initFileUpload = function (suffix) { $('#file_upload').fileUploadUI({ namespace: 'file_upload_' + suffix, fileInputFilter: '#file_' + suffix, dropZone: $('#drop_zone_' + suffix), uploadTable: $('#files_' + suffix), downloadTable: $('#files_' + suffix), buildUploadRow: function (files, index) { return $('<tr><td>' + files[index].name + '<\/td>' + '<td class="file_upload_progress"><div><\/div><\/td>' + '<td class="file_upload_cancel">' + '<button class="ui-state-default ui-corner-all" title="Cancel">' + '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' + '<\/button><\/td><\/tr>'); }, buildDownloadRow: function (file) { return $('<tr><td>' + file.name + '<\/td><\/tr>'); } }); }; initFileUpload(1); initFileUpload(2); initFileUpload(3); }); </script> </body> </html>
UploadServlet.java
package com.lkr.file; import java.io.ByteArrayOutputStream; import java.io.File; import java.io.FileNotFoundException; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.PrintWriter; import java.util.List; import javax.servlet.ServletContext; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.FileUploadException; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload; import org.apache.commons.fileupload.util.Streams; public class UploadServlet extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse * response) * */ protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { PrintWriter writer = response.getWriter(); writer.write("call POST with multipart form data"); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse * response) * */ @SuppressWarnings("unchecked") protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // System.out.println("path is :::::" + request.getContextPath()); if (!ServletFileUpload.isMultipartContent(request)) { throw new IllegalArgumentException( "Request is not multipart, please 'multipart/form-data' enctype for your form."); } ServletFileUpload uploadHandler = new ServletFileUpload( new DiskFileItemFactory()); PrintWriter writer = response.getWriter(); response.setContentType("text/plain"); try { List<FileItem> items = uploadHandler.parseRequest(request); // System.out.println("path is:"); for (FileItem item : items) { if (item.isFormField()) { // Normal field String name = item.getFieldName(); String value = Streams.asString(item.getInputStream()); // System.out.println("value is:" + value); } else { String filePath = "E:/BabysFirstear_Media/"; File file; if (!item.isFormField ()) { String fieldName = item.getFieldName(); String fileName = item.getName(); if (fileName == "") System.out.println("You forgot to choose a file."); boolean isInMemory = item.isInMemory(); long sizeInBytes = item.getSize(); if( fileName.lastIndexOf("\\") >= 0 ) { file = new File(filePath + fileName.substring(fileName.lastIndexOf("\\"))); } else { file = new File(filePath + fileName.substring(fileName.lastIndexOf("\\")+1)); } item.write(file) ; System.out.println("Uploaded Filename: " + filePath + fileName + ", sizeInBytes = " + sizeInBytes); } System.out.println("item name is:::" + item.getName()); //item.write(file); writer.write("{\"name\":\"" + item.getName() + "\",\"type\":\"" + item.getContentType() + "\",\"size\":\"" + item.getSize() + "\"}"); break; // assume we only get one file at a time } } } catch (FileUploadException e) { throw new RuntimeException(e); } catch (Exception e) { throw new RuntimeException(e); } finally { writer.close(); } } }
web.xml
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd" > <web-app> <display-name>Struts 2 Web Application</display-name> <servlet> <servlet-name>UploadServlet</servlet-name> <servlet-class>com.lkr.file.UploadServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>UploadServlet</servlet-name> <url-pattern>/upload</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>