`
leng_cn
  • 浏览: 298479 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

WEBWORK+javascript写的多文件上传

阅读更多
前段时间做一个项目,用户提出需要一次性上传多个文件,这个多=X,就是不确定,于是在客户端采用脚本(JAVASCRIPT)的方式来满足了用户的需求。

1。此项目采用的是WEBWORK的框架结构,webwork 文件上传采用拦截器的方式,叫fileUpload 可供选择的上传组件有pell和JAKATA和COS,具体的使用是通过webwork.properties这个文件来配置的,即

### Parser to handle HTTP POST requests, encoded using the MIME-type multipart/form-data
#webwork.multipart.parser=cos
webwork.multipart.parser=pell
在这里我采用了PELL的方式
注意:在使用这三种方式时,都会使用到相应的JAR包,PELL的方式会使用一个LOG4及pell-multpart.jar,初学使用者一定要注意

2。客户端脚本是通过新增一个文件上传的节点来实现的,这个新增的文件上传的HTML节点具有相同的名字,部分代码如下:
<script language="javascript" type="text/javascript"></script>
js 代码
 
  1.     function addAddition() {  //新增节点
  2.         var strInn = ";  
  3.         var strHid = ";  
  4.         otherAddition.insertAdjacentHTML("beforeEnd",strInn);  
  5.         additionName.insertAdjacentHTML("beforeEnd",strHid);  
  6.     }  
  7.     function delAddition() {  //删除节点
  8.         iIndex = otherAddition.childNodes.length  
  9.         nIndex = additionName.childNodes.length  
  10.         if(otherAddition.childNodes.length <= 2) return;  
  11.         otherAddition.removeChild(otherAddition.children(--iIndex));  
  12.         otherAddition.removeChild(otherAddition.children(--iIndex));  
  13.         additionName.removeChild(additionName.children(--nIndex));  
  14.     }  
调用部分的html代码如下:
xml 代码
 
  1. <div id="otherAddition"><input type="file" onkeydown="return false" id="fileAdditions" name="fileAdditions" style="width:400"><BR><!---->div>  
  2.       <span style="cursor:hand;color:red" onclick="addAddition()">再次添加附件<!---->span>  <span style="cursor:hand;color:red" onclick="delAddition()">删除附件<!---->span>  
  3.       <span id="additionName" name="additionName"><input type="hidden" id="fileName" name="fileName"><!---->span>  


这样做的目的是能够通过节点的方式让用户选择的上传多个文件
注意:因为上传多个文件到WEBWORK后台时,已经选择了原有的文件名,所以只能是增加一个文件名的节点,并在ACTION里面处理(看官如果有好的见意和想法欢迎指点:)

3。完成了配置和客户端的代码后,就是后台ACTION里面的处理了
java 代码
 
  1. public String getAddtion() throws Exception {  
  2.       
  3.     if (hasActionErrors() || hasFieldErrors()){  
  4.         System.out.println("found errors");  
  5.     }else if (fileAddition != null) {  
  6.         System.out.println("file uploaded to: " + fileAddition.getAbsolutePath());  
  7.         String uploadDir = ServletActionContext.getServletContext().getRealPath("\\upload") + "\\dc\\"; 
  8.         // write the file to the file specified 
  9.         System.out.println("the upload file path->" + uploadDir); 
  10.         File dirPath = new File(uploadDir); 
  11.         if (!dirPath.exists()) { 
  12.             System.out.println("build the dir path!"); 
  13.             if(!dirPath.mkdirs()) { 
  14.                 olpError.setErrorName("新建目录出错!"); 
  15.                 olpError.setErrorCode("103"); 
  16.                 return ERROR; 
  17.             } 
  18.         } else 
  19.             System.out.println("the path exists"); 
  20.         if (fileAddition == null) { 
  21.             log.debug("file is null!"); 
  22.         } 
  23.         String filePath = uploadDir + fileAddition.getName(); 
  24.          
  25.         File target = new File(filePath); 
  26.         System.out.println("filename is :" + fileAddition.getName()); 
  27.         if(target.exists()){ 
  28.             target.delete(); 
  29.         } 
  30.         fileAddition.renameTo(target); 
  31.         FileInputStream fis = new FileInputStream(target); 
  32.         byte[] buffer = new byte[fis.available()]; 
  33.         fis.read(buffer); 
  34.         fis.close();  
  35.         //publicInfo.setInfoIname(target.getName()); 
  36.         buffer = null; 
  37.         return target.getName(); 
  38.          
  39.     }else{ 
  40.         if(this.opt.equals("update")) { 
  41.             PublicInfo pinfoTmp = (PublicInfo)mngPublicInfo.loadByID(publicInfo.getId()); 
  42.             return pinfoTmp.getInfoIname(); 
  43.         } 
  44.     } 
  45.     return "";  
  46. }  //注意,增加private File[] fileAdditions;和private String[] fileName;两个成员变理及基get,set方法在action里面
分享到:
评论
2 楼 wrong1111 2009-08-06  
其实原理有些类似于多选框。。前面的name 都一样,后面action里面设一个数据组来接收。。。

在这里是文件上传,所以是以文件数组形式
1 楼 xueshuanglong 2009-04-17  
能否发了例子说明一下

相关推荐

Global site tag (gtag.js) - Google Analytics