通用文件上传组件

在我们开发WEB项目时，文件上传是最常用的功能，我最近在做一个自定义表单的 项目，当然自定义表单可能包含的控件包括普通文本，数字，日期，多行文本，富文本编辑，文件上传等控件，我是这样实现这个文件上传的控件，其中上传使用 common-upload开源包，上传完毕后用同样名称的隐藏字段替换原先的文件上传框，这样可实现表中字段与隐藏字段对应（此时是一个相对地址），后 台代码如下：

Java代码

1. String path = request.getContextPath();  
2. String name = StrCharUtil.formatNullStr(request.getParameter("name"));  
3. Date date = new Date();  
4. String classpath = FromAction.class.getResource("/")  
5.      .getPath().replaceAll("WEB-INF/classes/",  
6.     "upload/");  
7. FileUtil.mkDir(classpath  
8.      + DateFormatUtil.SIMPLE_DATE_FORMAT_yyyy  
9.                      .format(date));  
10. FileUtil.mkDir(classpath  
11.      + DateFormatUtil.SIMPLE_DATE_FORMAT_MM  
12.                      .format(date));  
13. FileUtil.mkDir(classpath  
14.      + DateFormatUtil.SIMPLE_DATE_FORMAT_dd  
15.                      .format(date));  
16. String savePath = classpath ;  
17. SingleFileUpload upload = new SingleFileUpload();  
18. upload.parseRequest(request);  
19. File parent = new File(savePath);      
20. String ret = upload.upload(parent);  
21. String downloadPath = ret.substring(ret.indexOf("upload")+6,ret.length());  
22. String fileName = FileUtil.getFilename(ret);  
23. out.println("<input type=\"hidden\" name=\""+name+"\" value=\""+downloadPath+"\"/>文件<a href=\""+path+"/upload/"+downloadPath+"\">"+fileName+"</a>已上传到服务器");     

String path = request.getContextPath(); String name = StrCharUtil.formatNullStr(request.getParameter("name")); Date date = new Date(); String classpath = FromAction.class.getResource("/") .getPath().replaceAll("WEB-INF/classes/", "upload/"); FileUtil.mkDir(classpath + DateFormatUtil.SIMPLE_DATE_FORMAT_yyyy .format(date)); FileUtil.mkDir(classpath + DateFormatUtil.SIMPLE_DATE_FORMAT_MM .format(date)); FileUtil.mkDir(classpath + DateFormatUtil.SIMPLE_DATE_FORMAT_dd .format(date)); String savePath = classpath ; SingleFileUpload upload = new SingleFileUpload(); upload.parseRequest(request); File parent = new File(savePath); String ret = upload.upload(parent); String downloadPath = ret.substring(ret.indexOf("upload")+6,ret.length()); String fileName = FileUtil.getFilename(ret); out.println("<input type=\"hidden\" name=\""+name+"\" value=\""+downloadPath+"\"/>文件<a href=\""+path+"/upload/"+downloadPath+"\">"+fileName+"</a>已上传到服务器");

前台控件如下(初始化所有样式为eform_uploadfile的文件上传框)：

Js代码

1. var myName = $(".eform_uploadfile").attr("name");  
2. var myUpload = $(".eform_uploadfile").upload({  
3.         name: 'file',  
4.         action: '/eForm/upload.jsp?name='+myName,  
5.         enctype: 'multipart/form-data',  
6.         params: {},  
7.         autoSubmit: true,  
8.         onSubmit: function() {},  
9.         onComplete: function(response) {$(".eform_uploadfile").replaceWith(response);},  
10.         onSelect: function() {}  
11. });   

var myName = $(".eform_uploadfile").attr("name"); var myUpload = $(".eform_uploadfile").upload({ name: 'file', action: '/eForm/upload.jsp?name='+myName, enctype: 'multipart/form-data', params: {}, autoSubmit: true, onSubmit: function() {}, onComplete: function(response) {$(".eform_uploadfile").replaceWith(response);}, onSelect: function() {} });