spring 注解上传文件 @RequestParam

一. 首先我们需要对formdata有所了解  

  1.FormData可以把它理解成一个虚拟的表单对象,它只有一个方法append,这个可以在浏览器console一下就知道了。我们可以通过append向FormData里面添加各种需要提交的数据。

  你可以先创建一个空的 FormData 对象,然后使用 append() 方法向该对象里添加字段,如下:var oMyForm = new FormData();

  oMyForm.append("username", "Groucho");

二.jquery的 $("form").serialize()和 new FormData表单序列化

  $("form").serialize()和 new FormData($(‘#uploadForm‘)[0])都是序列化表单,实现表单的异步提交,但是二者有区别

       首先,前者,只能序列化表单中的数据 ,比如文本框等input  select等的数据,但是对于文件,比如文件上传,无法实现,那么这时候,FormData就上场了,

       new FormData使用需要有一个注意点,

       注意点一:对于jquery的要求是,好像是 版本1.8及其以上方可支持。

       另外该对象不仅仅可以序列化文件,一样可以用作表单数据的序列化,(就是说包含了serialize()的功能);

  注意点二:

      contentType : false,必须false才会自动加上正确的Content-Type 


      processData : false,必须false才会避开jQuery对 formdata 的默认处理 ,XMLHttpRequest会对 formdata 进行正确的处理 

三.FormData的使用:

  1).前台

function save(){
        $('#user-form').bootstrapValidator('validate');
        var formValid = $('#user-form').data('bootstrapValidator').isValid();
            //if(formValid){
                var params = new FormData($('#user-form')[0]);
               ajax({ 
                url: "@url("/sample/saveMutilFile.action")",
                data:params,
                type:"post", 
                
                mask:true,
                /** 
                 *必须false才会自动加上正确的Content-Type 
                 */
                contentType:false,  
                /** 
                 * 必须false才会避开jQuery对 formdata 的默认处理 
                 * XMLHttpRequest会对 formdata 进行正确的处理 
                 */  
                processData:false,  
                success: function(result){
                    //刷新文件上传控件
                    if(result.data.file1){
                        $("#f1").fileinput('refresh', {
                            fileId:result.data.file1.fileId,
                            fileName:result.data.file1.fileName
                        });
                    }
                    if(result.data.file2){
                        $("#f2").fileinput('refresh', {
                            fileId:result.data.file2.fileId,
                            fileName:result.data.file2.fileName
                        });
                    }
                    if(result.data.file3){
                        $("#f3").fileinput('refresh', {
                            fileId:result.data.file3.fileId,
                            fileName:result.data.file3.fileName
                        });
                    }
                    $("#f4").fileinput('refresh', {
                            fileId:result.data.fileId,
                            fileName:result.data.fileName
                    });
                  }
            });
            //}
    }

  2).后台

    

 public ResultBean save(TbSystemInfo entity, @RequestParam("systemAttachment-file") MultipartFile systemfile) {
        // 附件保存
        long size = systemfile.getSize();
        // 获取文件名
        String fileName = systemfile.getOriginalFilename();
}

猜你喜欢

转载自www.cnblogs.com/zsber/p/9549930.html
今日推荐