• ajaxFileUpload带参数提交(亲测可用)


    使用ajaxFileUpload上传文件时,有时需要带参数提交,网上有很多资料说使用data,但其实要使用data带参数是需要修改的,否则后台是获取不到的.

    分析原因:

    ajaxFileUpload为了实现无刷新异步提交文件,构建 iframe 然后创建form表单 再将要上传的文件写上去再提交.但是原代码 却没有处理data.所以这块内容需要我们自己加上去.

    下面红色部分为修改ajaxFileUpload.js的三处地方:

    备注:好像csdn代码中加颜色加粗  有问题这三处修改的地方我直接贴出来,位置看下面的代码,

    ①createUploadForm: function(id, fileElementId,data);
    
    ②jQuery(form).appendTo('body')的前面修改:
    if (data) { for (var i in data) { $('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form); } } 

    ③var form = jQuery.createUploadForm(id, s.fileElementId,s.data);
    ajaxFileUpload为了实现无刷新异步提交文件,构建 iframe 然后创建form表单 再将要上传的文件写上去再提交.但是原代码 却没有处理data.所以这块内容需要我们自己加上去.
    下面红色部分为修改ajaxFileUpload.js的三处地方:
    备注:好像csdn代码中加颜色加粗  有问题这三处修改的地方我直接贴出来,位置看下面的代码,
    createUploadForm: function(id, fileElementId,data);
    
    if (data) { 
            for (var i in data) { 
                $('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form);
            } 
        }
    
    
    var form = jQuery.createUploadForm(id, s.fileElementId,s.data);
    ajaxfileupload js

    如何使用它呢?

    $.ajaxFileUpload({
                        url: 'http://localhost:8080/HNUST/crawler/ordinary2', 
                        type: 'post',
                        data : {
                            url : url,
                            keyword : keyword,
                            rule : rule,
                            data : data,
                            sign:sign
                        },
                        secureuri: false, //一般设置为false
                        fileElementId: 'file', // 上传文件的id、name属性名
                        dataType: 'JSON', //返回值类型,一般设置为json、application/json  这里要用大写  不然会取不到返回的数据
                        success: function(data, status){  
                            alert(data);
                        },
                        error: function(data, status, e){ 
                            alert(e);
                        }
                    }); 

    html:

    <input type="file" id="file" name="file">

    java后台接收参数  获取参数不能按照request.getParameter的方式,上传文件后台有两种方式(据我所知,欢迎拍砖),一种是是通过Servlet的方式,利用ServletFileUpload获取,FileItem集合,通过便利获取FileItem得到参数,不推荐

    FileItemFactory factory = new DiskFileItemFactory();
            ServletFileUpload servletFileUpload = new ServletFileUpload(factory);
        
    List<FileItem> fileItems = servletFileUpload.parseRequest(request);

    第二种方式,是通过spring mvc上传文件的方式,通过MultipartFile file,直接接收文件,需要配置

    <bean id="multipartResolver"    
            class="org.springframework.web.multipart.commons.CommonsMultipartResolver">    
            <!-- 默认编码 -->  
            <property name="defaultEncoding" value="utf-8" />    
            <!-- 文件大小最大值 -->  
            <property name="maxUploadSize" value="10485760000" />    
            <!-- 内存中的最大值 -->  
            <property name="maxInMemorySize" value="40960" />    
        </bean>  

    详细可以参考spring mvc 文件上传参数,通过该种方式可以通过request.getParameter获取参数

    使用过程中有两点需要注意的地方:

    其一,dataType必须要大写;

    其二:在data的值要写成json的格式,否则后台无法接受参数

    最后感谢@8英里的提示,让我修正之前的错误,避免给其他人代码不变。

    参考网站:

    http://blog.csdn.net/u013243986/article/details/51497057

    http://blog.csdn.net/cheung1021/article/details/7084673/

  • 相关阅读:
    Android布局优化
    Handler原理
    最少钱币数:
    ASCII码排序
    Fibonacci数
    奇偶数分离
    认识Dom
    js浏览器对象
    返回/设置时间方法与 Math对象
    window.open
  • 原文地址:https://www.cnblogs.com/peijie-tech/p/5715978.html
Copyright © 2020-2023  润新知