WebUploader上传组件,动态修改formData的方法


场景

在同一个页面上,点击按钮A后页面不跳转,而是动态传入一个orderId,并且用此值去上传图片入库。

问题

WebUploader无法携带动态传入的orderId值

原因

因为WebUploader初始化,是在页面第一次加载时就已经初始化完成了。

所以导致最初的数据已经提交到WebUpoader中。

而之后按钮A点击修改了orderId,是没法改变已经初始化完成后的orderId的。

解决

webUploader初始化代码如下:

//JavaScript
uploader = WebUploader.create({
...
    formData: {            
        orderId : $("#orderId").val(),
    },
...
}

由于按初次加载就读取了值,所以我们需要调用webUploader的API方法

//JavaScript
uploader.on('uploadBeforeSend', function (obj, data, headers) {
   data.orderId = orderId;
});

调用此方法,程序就会在获取一下当前页面最新的orderId

  • 可以用在jQuery的ajax请求中进行执行
$.ajaxFileUpload({
	url: ... ,                               // 用于文件上传的服务器端请求地址
    secureuri: false,				 // 是否需要安全协议,一般设置为false
    fileElementId: ..., 	                 // 文件上传域的ID
    dataType: 'json',				 // 返回值类型 一般设置为json
    success: function (data){  		 // 服务器成功响应处理函数
	uploader.on('uploadBeforeSend', function (obj, data, headers) {
		data.orderId = orderId;
	});
    }
})


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM