我想问一下如何使用jQuery验证插件来验证多个文件输入。
目前,我有以下代码,但无法正常工作:
.html:
<form id="uploadPhotoForm" enctype="multipart/form-data" method="POST">
<table class= "uploadPhotoTable">
<tr>
<td>Photo</td>
<td>:</td>
<td><input class="field" type="file" name="files[]" id="upload_photo" align='right' multiple /></td>
</tr>
</table>
</form>
.js:
$('#uploadPhotoForm').validate({
rules: {
files: {
required: true,
extension: "png"
}
},
messages:{
files:{
required : "Please upload atleast 1 photo",
extension:"Only png file is allowed!"
}
}
});
我还将使用此代码发布到新的PHP进行处理。但似乎在我的uploadPhoto.php中$_FILES['files']['tmp_name']
是未定义的。我可以知道如何解决这个问题吗?
if ($('#uploadPhotoForm').valid()) {
$.ajax({
url: "inc/uploadPhoto.php",
type: "POST",
data: new FormData(this),
contentType: false,
cache: false,
processData:false,
success: function(data){
$("#error1").html(data);
}
});
}
您需要'files[]'
代替files
,并且,如果您不添加Additional-methods.js,那么您会做到的。
$('#uploadPhotoForm').validate({
rules: {
'files[]': {
required: true,
extension: "png"
}
},
messages:{
'files[]':{
required : "Please upload atleast 1 photo",
extension:"Only png file is allowed!"
}
}
参见jsFiddle。
关于序列化。请阅读此如何使用jquery序列化上传文件
更新:
会工作的
if ($('#uploadPhotoForm').valid()) {
var form = $('#uploadPhotoForm')[0]; // [0], because you need to use standart javascript object here
var formData = new FormData(form);
$.ajax({
url: "inc/uploadPhoto.php",
type: "POST",
data: formData,
contentType: false,
cache: false,
processData:false,
success: function(data){
$("#error1").html(data);
}
});
}
您的代码还没有工作,我想是因为this
在data: new FormData(this),
没有有效的JavaScript表单对象。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句