插件“ blueimp / jQuery-File-Upload ”让我发疯。在表单内部,我有2个文件输入:一个用于图像,另一个用于文档。
<form id="file-upload">
<!--File 1 : Image -->
<input id="file-img" name="file1" type="file">
<input id="txt-file-img" type="text" class="form-control" style="background:white;" readonly>
<!--File 2 : Document -->
<input id="file-doc" name="file2" type="file">
<input id="txt-file-doc" type="text" class="form-control" style="background:white;" readonly>
</form>
我想根据用于选择文件的输入来应用不同的测试(大小和类型)。我在文档中找不到如何管理这种简单情况。
$('#file-upload').fileupload({
dataType: 'json',
autoUpload: false,
add: function (e, data) {
var uploadErrors = [];
var acceptImgTypes = /^image\/(gif|jpe?g|png)$/i;
var acceptDocTypes = /^application\/(pdf|msword)$|^text\/plain$/i;
/**TEST HERE**/
/** How to make the distinction between data coming from file-img and data coming from file-doc ? ***/
if(data.originalFiles[0]['type'].length && !acceptFileTypes.test(data.originalFiles[0]['type'])) {
uploadErrors.push('Not an accepted file type');
}
if(data.originalFiles[0]['size'].length && data.originalFiles[0]['size'] > 4000000) {
uploadErrors.push('File size is too big');
}
if(uploadErrors.length > 0) {
alert(uploadErrors.join("\n"));
} else {
/** Same problem here I need to make the distinction in order to update the right input[type=text]***/
$.each(data.files, function (index, file) {
$("#txt-file-img").val(file.name);
$("#txt-file-doc").val(file.name);
});
$("#btn_add_valid").on('click',function () {
$("#loading_modal").modal("show");
data.submit();
});
}
},
done: function (e, data) {
$("#loading_modal").modal("hide");
$("#output").html('<p class="sucess">OK!</p>');
},
progressall: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$('#upload-progress .bar').css(
'width',
progress + '%'
).text(
progress + '%'
);
},
fail: function (e, data) {
$("#output").html('<p class="error">FAIL!</p>');
}
});
您知道如何使用此插件管理多个输入[type = file]吗?
非常感谢您的帮助
我不明白为什么它不能与data.paramName一起使用,但是我找到了另一种解决方案来知道选择了哪个输入的文件:
data.fileInput[0].id
因此,最终的解决方案如下所示:
if (data.fileInput[0].id=="file-img")
{
...
}
else
{
....
}
我已经删除了文件输入中的所有名称参数,并且可以使用!
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句