fileupload上传时传递参数

jQuery.fileupload是一个比较通用的控件,如果是简单使用的话,也非常方便:
第一步引入相应的css跟js

    <link rel="stylesheet" href="/skins/skyblue/jquery.fileupload.css">
    <script src="/codebase/fileupload/vendor/jquery.ui.widget.js"></script>
    <script src="/codebase/fileupload/jquery.iframe-transport.js"></script>
    <script src="/codebase/fileupload/jquery.fileupload.js"></script>

第二部 在jsp或者html界面放入相应的form跟点击需要触发的按钮
我这里是用js动态生成html,插入到界面的一个div

   var formId = "fileupload" + GoingUtils.getUUid(3, false);
    var imgPath = "/going-bs-dhtmlx/codebase/toolbar/imgs/" + opts.img;
    var iframeHtml = '<form id="' + formId + '" action="" method="POST" enctype="multipart/form-data">' +
        '<div class="contentDiv">' +
        '<span class="btn btn-success fileinput-button">' +
        '<div style="float:left;width:20px;height:20px;position: relative;left:-2px;top:0px"><img src="' + imgPath + '"></div>' +
        '<span style="float:left;position: relative;left:-2px;top:5px"><span>上传</span>' +
        '<input  type="file" name="files" multiple>' +
        '</span></span>' +
        '</div>' +
        '</form>';
    $("#fileDiv").html(iframeHtml);

第三步就是初始化控件

var opts={
url:"",
initSubmitFormData:function(e,data){
//点击提交时,通过该函数来相后台提交相关参数
    data.formData = {projectId: $.Cookies.get("curProjectId")};
},
fun:function(){
//执行上传操作成功后,回调函数
},
}
  var bid = GoingUtils.getUUid(5, false);
    if (AssertUtils.isNotNull($("#" + formId).fileupload)) {
        $("#" + formId).fileupload({
            url: opts.url + "?bid=" + bid + "&filleType=excel&sessionId=" + top.sessionId + "&fileName=IMG_0048.JPG&userfile=systemFileControlfile1",//文件上传地址,当然也可以直接写在input的data-url属性内
            dataType: 'json',
            autoUpload: true,
            acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
            maxFileSize: 1000000, // 10 MB
            done: function (e, result) {
                var record = new Record(result.result);
                opts.fun();
            },
            progressall: function (e, data) {//设置上传进度事件的回调函数

            }
        })
        //就是通过该方法实现, 提交时往后台传递参数
        $("#" + formId).bind('fileuploadsubmit', function (e, data) {
            opts.initSubmitFormData(e, data);
        });
    } else {
        GoingUtils.showErrorMessage("请加载fileupload相应组件的js");
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值