现在的位置: 首页 > 综合 > 正文

struts上传文件

2013年10月20日 ⁄ 综合 ⁄ 共 2823字 ⁄ 字号 评论关闭

在前面的《Apache Commons FileUpload实现多文件上传》文章中介绍了http://使用第三方组件ApacheCommons
FileUpload来实现多文件的上传,对比今天用struts实现的多文件上传,总觉得还是struts用起来更加顺手,也更加简洁方便,不忍自己独享,所以拿出来跟大家一块分享一下。如果你读过前面提到的那篇文章,相信再理解本文将会更加容易,另外提供源码以方便大家学习(点此下载源码)。由于本文属于一片纯技术文章,废话就不多说了,下面看一下struts是如何实现多文件上传的吧。

1.      首先来看前台。在前台页面中通过js实现上传控件的添加和删除。描述的详细一些就是点一下“增加一行”按钮就会增加一个上传控件,同样点击该控件后边的“删除”则会将该上传控件去除。目的在于用js实现添加任意数目的文件的功能。

[html] view
plain
copy

  1. <span style="font-family:Microsoft YaHei;font-size:14px;"><%@ page language="java" pageEncoding="GB18030"%>  
  2.   
  3. <%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>  
  4.     
  5.   
  6. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  7. <html>  
  8.     <head>  
  9.     <title>multiUploadDemo</title>  
  10.     <script type="text/javascript" src="js/myjs.js">  
  11.       
  12.     </script>  
  13.  </head>  
  14.     <body bgcolor="#ffffff">  
  15.        <div id="status"></div>  
  16.             
  17.        <form method="post" action="upload.do" enctype="multipart/form-data" >  
  18.       
  19.             <table id="tb"></table>  
  20.   
  21.             <input type="button" name="AddOnLine" value="增加一行" onclick="additem('tb')"/>  
  22.             <input type="submit" name="btnUpload" value="上传" onclick="upload()"/>  
  23.         </form>  
  24.     </body>  
  25. </html>  
  26. </span>  

在前台页面中引用的js文件中的代码如下:

[javascript] view
plain
copy

  1. <span style="font-family:Microsoft YaHei;font-size:14px;"var num = 0;  
  2.   
  3.      function upload(){  
  4.          document.getElementById("status").innerHTML = "文件上传中...";  
  5.        }  
  6.   
  7.     function additem(id)  
  8.     {  
  9.      var row,cell,str;  
  10.   
  11.      row = eval("document.all["+'"'+id+'"'+"]").insertRow();  
  12.      if(row != null )  
  13.         {  
  14.            cell = row.insertCell();  
  15.            str="<input type="+'"'+"file"+'"'+" name=uploadFile["+ num +"].file><input type="+'"'+"button"+'"'+" value="+'"'+"删除"+'"'+" onclick='deleteitem(this,"+'"'+"tb"+'"'+");'>"  
  16.           cell.innerHTML=str;  
  17.         }  
  18.      num++;  
  19.     }  
  20.     function deleteitem(obj,id)  
  21.     {  
  22.      var rowNum,curRow;  
  23.      curRow = obj.parentNode.parentNode;  
  24.      rowNum = eval("document.all."+id).rows.length - 1;  
  25.      eval("document.all["+'"'+id+'"'+"]").deleteRow(curRow.rowIndex);  
  26.     }  
  27.     function callback(msg)  
  28.     {  
  29.      document.getElementById("status").innerHTML = "文件上传完成...<br>" + msg;  
  30.     }</span>  


2.      前台页面在实现了动态添加上传控件的功能后,真正用来上传文件的后台代码就要隆重登场了,后台代码中新建三个类,他们分别为UploadActionForm.java,UploadFile.java以及UploadTestAction.java。

UploadActionForm.java类代码如下:

[java] view
plain
copy

  1. <span style="font-family:Microsoft YaHei;font-size:14px;">package myupload;  
  2. import java.util.ArrayList;  
  3. import java.util.List;  
  4.   
  5. import org.apache.struts.action.ActionForm;  
  6. import org.apache.struts.upload.FormFile;  
  7.   
  8. public class UploadActionForm extends ActionForm {  
  9.       
  10.         private List myFiles;  
  11.   
  12.         public UploadActionForm() {  
  13.             myFiles = new ArrayList();  
  14.               
  15.         }  
  16.   

抱歉!评论已关闭.