Bootstrap Fileinput 4.4.7文件上传实例详解
前端之家收集整理的这篇文章主要介绍了
Bootstrap Fileinput 4.4.7文件上传实例详解,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
本实例所做功能为发送带附件邮件,可以上传多个附件,操作为选择一个附件以后自动上传,然后继续选择附件,填写完表单其他信息,点击保存发送带附件邮件。
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提交其他表单参数和所传附件文件名集合
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。