一.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插件上传文件的更多相关文章

  1. Extjs 使用fileupload插件上传文件 带进度条显示

    一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...

  2. 用jquery uploadify上传插件上传文件

    public void ProcessRequest(HttpContext context) { string esOIDs = System.Web.HttpContext.Current.Req ...

  3. 后台使用Spring MVC 4.15 版本 通过 ajaxFileUpload plugin插件上传文件相应时引起的一个小问题,Chrome、Firefox中出现SyntaxError:unexpected token <

    html: 使用ajaxFileUpload插件做文件上传时,后台返回json格式的数据,js代码如下: 接下来,把结果错误信息打印出来: 先在网上找了下解决办法方案,stackoverflow上有说 ...

  4. 使用SWFUpload插件上传文件

    演示代码由两部分组成,包括前台文件和后台文件: 1.前台文件index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transi ...

  5. 《五》uploadify插件上传文件

    下载地址:http://www.uploadify.com/wp-content/uploads/files/uploadify.zip 相关配置:http://www.uploadify.com/d ...

  6. ajaxFileUpload插件上传文件 返回 syntaxError :unexpected token

    Html 代码<table id="deploy_application" class="bordered-table"> <tr> & ...

  7. ajaxFileUpload上传文件简单示例

    写在前面: 上传文件的方式有很多,最近在做项目的时候,一开始也试用了利用jquery的插件ajaxFileUpload来上传大文件,下面,用一个上传文件的简单例子,记录下,学习的过程~~~ 还是老样子 ...

  8. php 应用 bootstrap-fileinput 上传文件 插件 操作的方法

    //先加载插件所需要的 js .css 文件 <link href="css/fileinput.css" rel="stylesheet" type=& ...

  9. bootstrap-fileinput上传文件的插件使用总结----编辑已成功上传过的图片

    http://plugins.krajee.com/file-plugin-methods-demo 具体操作 http://plugins.krajee.com/file-preview-manag ...

随机推荐

  1. centos下安装memcached

    1.   通过yum安装 yum -y install memcached #安装完成后执行: memcached –h 2.   Memcached 运行 //查看考号修改配置 vim /etc/s ...

  2. Docker 入门到实践(三)Docker 安装

    注意:不要在没有配置 Docker APT 源的情况下直接使用 apt 命令安装 Docker. 一.准备工作 系统要求 Docker CE 支持一下版本的 Ubuntu 操作系统 Cosmic 18 ...

  3. February 14th, 2018 Week 7th Wednesday

    Love does not dominate, it culitvates. 爱不是羁绊,而是成就. Love should not wipe out everything you are, love ...

  4. creo2.0安装方法和图文详解教程

    Creo2.0是由PTC公司2012年8月底推出的全新CAD设计软件包,整合了PTC公司的三个软件Pro/Engineer的参数化技术.CoCreate的直接建模技术和ProductView的三维可视 ...

  5. 【Linux基础】Linux常用命令汇总

    3-1文件目录操作命令(cd pwd mkdir rmdir rm) 绝对路径:由根目录(/)开始写起的文件名或目录名称, 例如 /home/dmtsai/.bashrc: 相对路径:相对于目前路径的 ...

  6. SQL IN 操作符

    IN 操作符 IN 操作符允许我们在 WHERE 子句中规定多个值. SQL IN 语法 SELECT column_name(s) FROM table_name WHERE column_name ...

  7. UVA1347-Tour(动态规划基础)

    Problem UVA1347-Tour Accept: 667  Submit: 3866Time Limit: 3000 mSec Problem Description John Doe, a ...

  8. [SDOi2012]吊灯

    嘟嘟嘟 这题想了半天,搞出了一个\(O(10 * d * n)\)(\(d\)为\(n\)的约数个数)的贪心算法,就是能在子树内匹配就在子树内匹配,否则把没匹配的都交给父亲,看父亲能否匹配.交上去开了 ...

  9. springcloud 服务注册、反注册 AOP 拦截,实现自定义功能

    @Aspect@Component@Order(1000)public class EurekaServerAspect {private Logger logger = Logger.getLogg ...

  10. ubuntu查看安装的pytorch/cuda版本

    使用命令: user@home:~$ python Python |Anaconda custom (-bit)| ( , ::) [GCC ] on linux Type "help&qu ...