ajaxfileupload,ajaxFileUpload防止重复提交
ajaxFileUpload上传文件时,自定义参数data后台获取为null的问题
ajaxFileUpload自定义参数,后台获取的时候为null
解决办法:修改ajaxFileUpload.js文件中createUploadForm()函数,新增传入参数data,并创建hidden控件,存储自定义参数
createUploadForm: function (id, fileElementId, data) {
....
if (data) {
}
找到ajaxFileUpload.js文件中调用createUploadForm()函数的地方,传入产生即可
ajaxFileUpload: function (s) {
...
var form = jQuery.createUploadForm(id, s.fileElementId,s.data);
...
}
DWZ中怎样整合JQuery的ajaxFileUpload上传插件
jQuery插件AjaxFileUpload可以实现ajax文件上传,需要jQuery库文件和ajaxfileupload.js
一.引入部分
script type="text/javascript" src="jquery.js"/script
script type="text/javascript" src="ajaxfileupload.js"/script
二.body部分
img src="images/nophoto.jpg" id="picture" width="160px" height="200px"/
input type="file" id="touxiang" name="photo" size="10" onchange="changImg()"/
注意:使用AjaxFileUpload插件上传文件可不需要form
form name="form" action="" method="POST" enctype="multipart/form-data"
……相关html代码……
/form
三.js部分
function changImg(){
$.ajaxFileUpload
(
{
url:'XXX.action', //上传文件的服务端
secureuri:false, //是否启用安全提交
dataType: 'text', //数据类型
fileElementId:'touxiang', //表示文件域ID
//提交成功后处理函数 html为返回值,status为执行的状态
success: function(html,status)
{
},
//提交失败处理函数
error: function (html,status,e)
{
}
}
)
}
四.原理
利用jQuery的选择器获得file文件上传框中的文件路径值,然后动态的创建一个iframe,并在里面建立一个新的file 文件框,提供post方式提交到后台。最后,返回结果到前台。
五.总结
使用jQuery插件AjaxFileUpload实现无刷新上传文件非常实用,由于其简单易用,因些这个插件相比其它文件上传插件使用人数最多,非常值得推荐。
ajaxFileUpload 怎么传相关参数到后台
先简介一下ajaxFileUpload参数:
options参数说明:
1、url 上传处理程序地址。
2,fileElementId 需要上传的文件域的ID,即input type="file"的ID。
3,secureuri 是否启用安全提交,默认为false。
4,dataType 服务器返回的数据类型。可以为xml,script,json,html。如果不填写,jQuery会自动判断。
5,success提交成功后自动执行的处理函数,参数data就是服务器返回的数据。
6,error 提交失败自动执行的处理函数。
7,data 自定义参数。这个东西比较有用,当有数据是与上传的图片相关的时候,这个东西就要用到了。
8, type 当要提交自定义参数时,这个参数要设置成pos
$.ajaxFileUpload({ url : 'upload',
secureuri : false, fileElementId : 'fileToUpload',
dataType : 'json', data : {id:id},//这种写法我在后台不管怎么取,值都为null 就去百度了一下,最后还是没有解决
success : function(data, status) { $('#viewImg').attr('src',data.picUrl);
}, error : function(data, status, e) {
alert('上传出错'); }
})
这样就与options参数说明中data参数不符合了,最终还是没有找到原因是那点没有写正确。