fileInput插件上传文件
一.ftl
<form action="" method="post" name="form" id="form"> <div class="m-solbox m-solbox-3"> <div style="margin-left:180px"> <table style="border-collapse: separate;border-spacing: 10px;font-size: 14px;"> <tr> <td>版本: <input type="hidden" name="id" value="" > </td> </tr> <tr> <td>上传附件:</td> <td> <input id="uploadFile" type="file" name="fileName" multiple /> </td> </tr> <#if files??> <tr> <td>已有附件:</td> <td> <#escape x as x!""> <#list files as fileName > <span> <a href="${filePaths[fileName_index]}">${fileName}</a> <a href="###" title="删除" onclick='deleteFile(this,"${fileName}")'> <img src="/img/nav/Trash_Delete.png" style="border: none"> </a> </span> </#list> </#escape> </td> </tr> </#if> </table> </div> </div> </form>
引入文件:
<link href="/css/flash/fileinput.css" media="all" rel="stylesheet" type="text/css" />
<script src="/js/base/fileinput.js" type="text/javascript"></script>
二.js : proReports.js
$(document).ready(function(){ initFileInput("uploadFile"); }); function initFileInput(ctrlName) { var control = $('#' + ctrlName); control.fileinput({ uploadUrl: '/file/uploadFile', language: "zh", //showUpload: false, //是否显示上传按钮 dropZoneEnabled: false, //是否显示拖拽区域 enctype: 'multipart/form-data', uploadExtraData: { //上传的时候,增加的附加参数 "projectId": $("#project_id").val(), "versionId": $("#versionId").val(), "fea": $("#fea").val() } })//文件上传完成后的事件 .on('fileuploaded', function (event, data, previewId, index) { var response = data.response; //alert(response.msg); window.location.reload(); }); } function deleteFile(obj,deleteFile){ if(confirm('确认要删除么?')){ $.ajax({ type: 'POST', url: '/pro/deleteFile', data:{ "projectId": $("#project_id").val(), "versionId": $("#versionId").val(), "fea": $("#fea").val(), "deleteFile":deleteFile, }, cache:false, dataType : "json", success: function(data){ if(data.msg=="删除失败"){ alert(data.msg); }else{ $(obj).parent().remove(); } } }); } }
三.上传文件的controller :ProEmailAttachmentController
@RequestMapping(value="/file/uploadFile",method = RequestMethod.POST) public @ResponseBody Map<String, Object> uploadFile(@RequestParam("fileName") MultipartFile[] file,HttpServletRequest request) throws Exception{ String projectIdStr = request.getParameter("projectId"); Integer projectId = Integer.valueOf(projectIdStr); String fea = request.getParameter("fea"); String versionIdStr=request.getParameter("versionId"); Integer versionId = Integer.valueOf(versionIdStr); String msg = ""; try { //上传 String path = Thread.currentThread().getContextClassLoader().getResource("").getPath(); path=path+"folderPath.properties"; Properties prop = new Properties(); prop.load(new FileInputStream(path)); String uploadPath =prop.getProperty("UploadMailPath")+"/"+projectId+"/"+fea+"/"+versionId; for (int i = 0; i < file.length; i++) { if (!file[i].isEmpty()) { // 文件名称 File targetFile = new File(uploadPath, file[i].getOriginalFilename()); if (!targetFile.exists()){ targetFile.mkdirs(); } file[i].transferTo(targetFile); } } } catch (Exception e) { e.printStackTrace(); logger.info(e.getMessage()); msg = "上传失败!"; } Map<String, Object> map = new HashMap<String, Object>(); map.put("msg", msg); map.put("code", 200); return map; } @RequestMapping(value="/pro/deleteFile",method = RequestMethod.POST) public @ResponseBody Map<String, Object> deleteFile(HttpServletRequest request) throws Exception{ String projectIdStr = request.getParameter("projectId"); Integer projectId = Integer.valueOf(projectIdStr); String fea = request.getParameter("fea"); String versionIdStr=request.getParameter("versionId"); Integer versionId = Integer.valueOf(versionIdStr); String deleteFile=request.getParameter("deleteFile"); String msg = ""; try { //上传 String path = Thread.currentThread().getContextClassLoader().getResource("").getPath(); path=path+"folderPath.properties"; Properties prop = new Properties(); prop.load(new FileInputStream(path)); String uploadPath =prop.getProperty("UploadMailPath")+"/"+projectId+"/"+fea+"/"+versionId; File targetFile = new File(uploadPath, deleteFile); if (targetFile.exists()){ targetFile.delete(); } } catch (Exception e) { e.printStackTrace(); logger.info(e.getMessage()); msg = "删除失败!"; } Map<String, Object> map = new HashMap<String, Object>(); map.put("msg", msg); map.put("code", 200); return map; } 4.获取文件的Controller :ProReportController @RequestMapping(value = "/pro/report", method = RequestMethod.GET) public String home(HttpServletRequest request, Model model) throws FileNotFoundException, IOException { String projectIdStr = request.getParameter("projectId"); Integer projectId = Integer.valueOf(projectIdStr); model.addAttribute("productId", projectId); Project project = systemService.getProjectByProjectId(projectId); List<Version> versionList = systemService.getVersionByProjectId(projectId); FeatureEmail featureEmail = this.featureEmailMngr.getFeatureEmailByProductIdAndFea(projectId, "0"); String[] checkEmails = null; if(featureEmail != null && !CheckUtils.isNullOrBlank(featureEmail.getCheckEmail())) { checkEmails = featureEmail.getCheckEmail().split(","); } String user = this.authService.getCookieParameter(request, "token","userid").split(" ")[0]; model.addAttribute("user", user); // 处理邮件主题 StringBuffer subject=new StringBuffer(); subject.append("【请阅:PDU一部产品与解決方案测试部】"); subject.append(project.getName().split("-")[0]+" "); subject.append("产品测试报告"); SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd"); subject.append("("+df.format(new Date())+")"); model.addAttribute("subject", subject); if (CheckUtils.isNullOrBlank(versionList)){ model.addAttribute("isFind", new Boolean(false)); return "/productkanban/report"; }else { model.addAttribute("isFind", new Boolean(true)); } model.addAttribute("featureEmail", featureEmail); model.addAttribute("checkEmails", checkEmails); //处理已有附件 String path = Thread.currentThread().getContextClassLoader().getResource("").getPath(); path=path+"folderPath.properties"; Properties prop = new Properties(); prop.load(new FileInputStream(path)); String uploadPath =prop.getProperty("UploadMailPath")+"/"+projectId+"/0/"+versionId; File destDir = new File(uploadPath); if (destDir.exists()) { List<String> files = FileUtils.getFile(uploadPath); if(!CheckUtils.isNullOrBlank(files)){ List<String> filePaths = new ArrayList<String>(); for(String fileName:files){ filePaths.add(prop.getProperty("UploadMailURL")+"/"+projectId+"/0/"+versionId+"/"+fileName); } model.addAttribute("files", files); model.addAttribute("filePaths", filePaths); } } return "/productkanban/report"; }
fileInput插件上传文件的更多相关文章
- Extjs 使用fileupload插件上传文件 带进度条显示
一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...
- 用jquery uploadify上传插件上传文件
public void ProcessRequest(HttpContext context) { string esOIDs = System.Web.HttpContext.Current.Req ...
- 后台使用Spring MVC 4.15 版本 通过 ajaxFileUpload plugin插件上传文件相应时引起的一个小问题,Chrome、Firefox中出现SyntaxError:unexpected token <
html: 使用ajaxFileUpload插件做文件上传时,后台返回json格式的数据,js代码如下: 接下来,把结果错误信息打印出来: 先在网上找了下解决办法方案,stackoverflow上有说 ...
- 使用SWFUpload插件上传文件
演示代码由两部分组成,包括前台文件和后台文件: 1.前台文件index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transi ...
- 《五》uploadify插件上传文件
下载地址:http://www.uploadify.com/wp-content/uploads/files/uploadify.zip 相关配置:http://www.uploadify.com/d ...
- ajaxFileUpload插件上传文件 返回 syntaxError :unexpected token
Html 代码<table id="deploy_application" class="bordered-table"> <tr> & ...
- ajaxFileUpload上传文件简单示例
写在前面: 上传文件的方式有很多,最近在做项目的时候,一开始也试用了利用jquery的插件ajaxFileUpload来上传大文件,下面,用一个上传文件的简单例子,记录下,学习的过程~~~ 还是老样子 ...
- php 应用 bootstrap-fileinput 上传文件 插件 操作的方法
//先加载插件所需要的 js .css 文件 <link href="css/fileinput.css" rel="stylesheet" type=& ...
- bootstrap-fileinput上传文件的插件使用总结----编辑已成功上传过的图片
http://plugins.krajee.com/file-plugin-methods-demo 具体操作 http://plugins.krajee.com/file-preview-manag ...
随机推荐
- windows 解放鼠标快捷键
win+ 调整某个窗口的放大缩小靠边站,最小化 窗口间的切换alt+tablealt (按住)+table(一下)+ 上下左右 alt(一下)+table(一下)相邻切换 alt(按住)+tables ...
- 15个实用的PHP正则表达式
对于开发人员来说,正则表达式是一个非常有用的功能,它提供了 查找,匹配,替换 句子,单词,或者其他格式的字符串.这篇文章主要介绍了15个超实用的php正则表达式,需要的朋友可以参考下.在这篇文章里,我 ...
- PATH_SEPARATOR
PATH_SEPARATOR是一个常量,在Linux系统中是一个" : "号,Windows上是一个";"号.所以编写程序时最好用常量 PATH_SEPARAT ...
- Java操作Excel(使用JXL)
一.本地操作 1.读取 package com.ljf.mb; import java.io.FileInputStream; import java.io.InputStream; import j ...
- 附2 rabbitmq用户管理、角色管理与权限管理
本文摘自:http://my.oschina.net/hncscwc/blog/262246 1. 用户管理 用户管理包括增加用户,删除用户,查看用户列表,修改用户密码. 相应的命令 (1) 新增一个 ...
- 三、安装cmake,安装resin ,tars服务,mysql 安装介绍,安装jdk,安装maven,c++ 开发环境安装
三.安装cmake,安装resin 2018年07月01日 21:32:05 youz1976 阅读数:308 开发环境说明: centos7.2 ,最低配置:1核cpu,2G内存,1M带宽 1. ...
- c# 链接mongDB集群实战开发3
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/zuoming120/article/details/25702295 c# 链接mongDB集群 一 ...
- 机器学习之MCMC算法
1.MCMC概述 从名字我们可以看出,MCMC由两个MC组成,即蒙特卡罗方法(Monte Carlo Simulation,简称MC)和马尔科夫链(Markov Chain ,也简称MC).之前已经介 ...
- SpringBoot-06:SpringBoot增删改查一套完整的考试案例
本此博客记录一套考试题,随后我把项目以及题目发到github上,简单的说一下springboot的开发 本此考试题用Spring+SpringMVC+MyBatis+SpringBoot+MySQL+ ...
- ORA-01034:ORACLE not available ORA-27101:shared memory realm does not exit
ORA-01034:ORACLE not available ORA-27101:shared memory realm does not exit ERROR: ORA-01034:ORACLE ...