Tuesday 27 December 2016

How to upload multiple file using jsp




save as 'img.jsp'

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
    <style type="text/css">
        body
        {
            font-family: Arial;
            font-size: 10pt;
        }
    </style>
    <script language="javascript" type="text/javascript">
       function chkFile(){         
      var fileChk =  document.getElementById("fileupload").value;
           if(fileChk==null || fileChk==""){
            alert("Please upload any file !");
           return false;
           }
       }
        window.onload = function () {
            var fileUpload = document.getElementById("fileupload");
            fileUpload.onchange = function () {
                if (typeof (FileReader) != "undefined") {
                    var dvPreview = document.getElementById("dvPreview");
                    dvPreview.innerHTML = "";
                    var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.pdf|.xls|.xlsx|.doc|.docx)$/;
                    for (var i = 0; i < fileUpload.files.length; i++) {
                        var file = fileUpload.files[i];
                        if (regex.test(file.name.toLowerCase())) {
                            var reader = new FileReader();
                            reader.onload = function (e) {
                                var img = document.createElement("IMG");
                                img.height = "100";
                                img.width = "100";
                                img.src = e.target.result;
                                dvPreview.appendChild(img);
//alert("img >> "+file.name+img);
                            }
                            reader.readAsDataURL(file);
                        } else {
                            alert(file.name + " is not a valid image file.");
                            dvPreview.innerHTML = "";
                            document.getElementById("fileupload").value="";
                            return false;
                        }
                    }
                } else {
                    alert("This browser does not support HTML5 FileReader.");
                }
            }
        };
    </script>
</head>
<body>
 <form action="upload_file_multipale.jsp" method="post" enctype="multipart/form-data" name="form1" id="form1">
    <div>
        <input id="fileupload" name="file" type="file" multiple="multiple" />
        <hr />
        <b>Live Preview</b>
        <br />
        <br />
        <div id="dvPreview">
        </div>
           <input type="submit" name="Submit" value="Submit files" onClick="chkFile();" />
    </div>
    </form>
</body>
</html>


save as 'upload_file_multipale.jsp'


   <%@ page import="java.util.List" %>
   <%@ page import="java.util.Iterator" %>
   <%@ page import="java.io.File" %>
   <%@ page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%>
   <%@ page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
   <%@ page import="org.apache.commons.fileupload.*"%>
   <%@ page contentType="text/html;charset=UTF-8" language="java" %>
   <center><table border="2">
        <tr><td><h1>Your files  uploaded </h1></td></tr>
   <%
 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.printStackTrace();
  }
  Iterator itr = items.iterator();
  while (itr.hasNext()) {
  FileItem item = (FileItem) itr.next();
  if (item.isFormField()) {
  } else {
  try {
  String itemName = item.getName();
  File savedFile = new File("G:/uploadedFiles/"+itemName);
  item.write(savedFile);  
  out.println("<tr><td><b>Your file has been saved at the loaction:</b></td></tr><tr><td><b>"+config.getServletContext().getRealPath("/")+"uploadedFiles"+"\\"+itemName+"</td></tr>");
  } catch (Exception e) {
  e.printStackTrace();
  }
  }
  }
   }
   %>
    </table>
   </center>