Bootstrap Fileinput 4.4.7文件上传实例详解

本实例所做功能为发送带附件邮件,可以上传多个附件,操作为选择一个附件以后自动上传,然后继续选择附件,填写完表单其他信息,点击保存发送带附件邮件

HTML标签

js初始化,设置全局文件名参数

上传的文件数量({n}) 超过允许的最大数值{m}!",}).on("filebatchselected",function(event,files) { $("#fileUpload").fileinput("upload"); }).on("filebatchuploadsuccess",function (event,data,previewId,index){ if(data.response.success == true) { fileName.push(data.response.fileName); }else{ alert("上传失败!"); } $("#fileUpload").fileinput("clear"); $("#fileUpload").fileinput("reset"); }).on('fileerror',msg) { alert(msg); }); }

java后台上传文件代码

fileUpload(HttpServletRequest request,HttpServletResponse response) { ResourceBundle bundle = PropertyResourceBundle.getBundle("application"); MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest)request; Map fileMap = multipartRequest.getFileMap(); String rootPath = bundle.getString("upLoadUrl"); String filePath = rootPath; Map map = new HashMap<>(); map = uploadFiles(filePath,fileMap); return map; }

实际上传操作,返回上传操作经过处理的文件名,保证服务器端文件名唯一

uploadFiles(String savePath,Map fiLeMap){ Map map = new HashMap<>(); try { String fileName = ""; if(fiLeMap!=null){ for(Map.Entry entity:fiLeMap.entrySet()){ MultipartFile f = entity.getValue(); if(f != null && !f.isEmpty()){ String uuid = UUID.randomUUID().toString(); fileName = uuid + "#" + f.getOriginalFilename(); File newFile = new File(savePath + "/" + fileName); f.transferTo(newFile); } } } map.put("success",true); map.put("fileName",fileName); return map; }catch (Exception e) { map.put("success",false); return map; } }

ajax提交其他表单参数和所传附件文件名集合

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

相关文章

BootStrapValidator可以用于完成基于BootStrap搭建的前端UI中的输入验证,由于本插件完全基于BootStrap...
顶求网首页是一个web2.0博客类的网站首页,在该网站中用户可以发表博客,也可以推荐图书给其他用户。所...
一直想改版网站首页的图书展示部分,以前的展示是使用BootStrap的传统的collapse,网页篇幅占用大,也不...
在视窗足够大的时候是没有任何问题的,但是当拖动改变视窗的大小后会发现布局又变乱了,这个问题困扰了...
BootStrap中的tabs控件以其简单易用而很受广大开发者的欢迎。但是,它的样式比较单一,如何才能在其原有...
BootStrap是基于HTML、CSS和JavaScript的框架,使你只需要写简单的代码就可以很快的搭建一个还不错的前...