Ext多文件上传下载

以下代码为项目应用中整理，仅供参考。

一.多文件上传

1.前台Js代码事例

items : [{xtype : 'button',text : '添加附件',iconCls : 'silk_page_add',handler : function() {Ext.getCmp("upfile").addFile();}}, {xtype : 'multifileupload',width : 750,allowBlank : false,fileConfig : {xtype : 'fileuploadfield',emptyText : '选择文件上传',fieldLabel : '上传文件',anchor : '95%',buttonCfg : {text : '',iconCls : 'silk_folder_find'}},id : 'upfile',startId : 'post',startName : 'post',labelWidth : 70,limit : 10,allowBlank : false}
]

2.后台代码获取上传附件

MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest)request;
Set<MultipartFile> fileset = new LinkedHashSet<MultipartFile>();
for (Iterator it = multipartRequest.getFileNames(); it.hasNext();) {String key = (String) it.next();MultipartFile file = multipartRequest.getFile(key);if (file.getOriginalFilename().length() > 0) {fileset.add(file);}
}

注：多附件时可考虑专门建立一个附件表存放附件，在表单提交时需更新附件表，
同时将多个附件的主键ID以”,”隔开存到主表中。

二.多文件展示，下载，删除

1.前台Js代码，创建fieldSet

function createDownLoadFieldSet(data,messageId) {downLoadFieldSet = new Ext.form.FieldSet({title : '附件下载',border : true,width : '100%',layout : 'column',autoHeight : true,collapsible: true,collapsed : true});// data为附件表的主键ID，多个以;隔开var attachUrls = data;var attachaUrlArr = attachUrls.split(";");attachaUrlArr.pop();Ext.each(attachaUrlArr, function(urlid) {callBackUrl(urlid,messageId);})
}

2.Js附件展示代码

function callBackUrl(urlid,messageId){Ext.Ajax.request({url : SMIS.CTX+'/work/post/postListController/getDocumentByUuid.do',method : 'POST',params : {urlId : urlid},success : function(resp,opt) {var doc = Ext.util.JSON.decode(resp.responseText);// 附件路径var url = doc.attachmentvar pathArr = url.split("/");var fileName = pathArr[pathArr.length - 1];var temp = downLoadFieldSet.add({columnWidth : 1,id : url,style : {padding : '0 0 5 0'},layout : 'column',items : [{xtype : 'label',width : '45%',text : fileName.substring(fileName.indexOf("_")+1,fileName.length),iconCls : 'silk_application_view_gallery'}, {xtype : 'label',width : '5%'}, {xtype : 'label',width : '25%',text : new Date(parseInt(fileName.substring(0,fileName.indexOf("_")))).toLocaleString(),iconCls : 'silk_application_view_gallery'}, {xtype : 'button',text : '下载附件',iconCls : 'silk_application_put',handler : function() {// Js方法，将URL中的中文进行编码url = encodeURI(url); window.open(SMIS.CTX + '/work/post/postListController/getAttachment.do?attachmentFile='+ url);url = decodeURI(url);}}, {xtype : 'button',text : '删除附件',iconCls : 'silk_application_put',handler : function(){removeAttachment(temp,messageId,url);}}]})},failure : function(){Ext.Msg.alert('执行失败',"执行失败！");}})
}

3.附件移除代码

function removeAttachment(temp,messageId,url){u = encodeURI(url); Ext.Ajax.request({url : SMIS.CTX + '/discipline/mechanism/SmisInstitutionController/deleteAttachment.do?messageId='+messageId+'&attachmentFile='+u,method : 'POST',success : function(resp ,action){if(Ext.util.JSON.decode(resp.responseText).success){Ext.Msg.alert("执行成功",Ext.util.JSON.decode(resp.responseText).msg);var newattachments = Ext.getCmp("attachments").getValue().replace(Ext.util.JSON.decode(resp.responseText).documentId,"");Ext.getCmp("attachments").setValue(newattachments);// 移除附件显示downLoadFieldSet.remove(Ext.getCmp(url));}else{Ext.Msg.alert("执行失败",Ext.util.JSON.decode(resp.responseText).msg);}},failure : function(){Ext.Msg.alert("执行失败","执行过程中发生错误！");}})
}

4.后台代码获取附件进行下载

java.net.URLDecoder.decode(request.getParameter("attachmentFile"),"UTF-8");
String attachmentFile = java.net.URLDecoder.decode(request.getParameter("attachmentFile"),"UTF-8");
response.setContentType("text/html;charset=UTF-8");
try {File file = new File(attachmentFile);InputStream fis = new BufferedInputStream(new FileInputStream(file));byte[] buffer = new byte[fis.available()];fis.read(buffer);fis.close();response.reset();response.addHeader("Content-disposition", "attachment;filename=\"" + new String(file.getName().getBytes("gb2312"), "ISO8859-1"));response.addHeader("Content-Length", "" + file.length());OutputStream toClient = new BufferedOutputStream(response.getOutputStream());toClient.write(buffer);toClient.flush();toClient.close();
} catch (IOException ex) {ex.printStackTrace();
}

Ext多文件上传下载相关推荐

SpringMVC整合fastdfs-client-java实现web文件上传下载
为什么80%的码农都做不了架构师?>>> 版权声明:本文为博主原创文章,转载请标明出处(http://blog.csdn.net/wlwlwlwl015)Thanks. 目录( ...
springboot文件上传下载实战 ——文件上传、下载、在线打开、删除
springboot文件上传下载实战文件上传文件上传核心 UserFileController 文件上传测试文件下载与在线打开文件下载.在线打开核心 UserFileController 文件 ...
springboot文件上传下载实战 —— 登录功能、展示所有文件
springboot文件上传下载实战创建项目 pom.xml 数据库建表与环境准备建表SQL 配置文件 application.properties 整体架构前端页面登录页面 login.ht ...
JSP基础：（7）jsp分页与文件上传下载
目录 1 jsp分页 1.1 定义 1.2 Servlet控制器方法 2 文件上传下载 2.1 定义 2.2 SmartUpload 2.2.1 介绍 2.2.2 SmartUpload组件-Requ ...
aws php 上传文件限制大小_php如何实现文件上传下载-PHP问题
php实现文件上传下载的方法:首先创建好表单页面:然后将客户端文件上传到服务器端:最后将服务器端的文件移动到指定目录即可. 推荐:<PHP视频教程> PHP实现文件上传与下载一.上传原理 ...
Jersey框架：文件上传下载
企业应用中,文件管理是非常通用和重要的模块,功能包括文件上传.下载.文件管理(浏览.删除.权限等)等操作,本文针对Jersey框架实现文件的上传和下载. Jersey文件特性 Jersey实现文件上传 ...
教你如何实现c#文件上传下载功能
简单介绍一下c#文件上传下载功能实现. NuGet 安装SqlSugar Model文件下新建 DbContext 类 public class DbContext {public DbContext ...
[C# 网络编程系列]专题十一：实现一个基于FTP协议的程序——文件上传下载器...
引言: 在这个专题将为大家揭开下FTP这个协议的面纱,其实学习知识和生活中的例子都是很相通的,就拿这个专题来说,要了解FTP协议然后根据FTP协议实现一个文件下载器,就和和追MM是差不多的过程的,相信 ...
JavaWeb实现文件上传下载功能实例解析
转:http://www.cnblogs.com/xdp-gacl/p/4200090.html JavaWeb实现文件上传下载功能实例解析在Web应用系统开发中,文件上传和下载功能是非常常用的功能 ...

Ext多文件上传下载

Ext多文件上传下载相关推荐

最新文章

热门文章