Javascript Dropzone,如果存在错误,如何不处理队列
因此,我有一个带有Dropzone的表单,加上另一个textarea,我想提交-如果我插入了过大的文件或太多,我会在预览容器中出现“过大”错误,等等。但是表单在单击表单提交按钮后会继续处理(由于我的侦听器)。如果两个文件的文件大小都正确且不超过最大文件限制,我如何才能提交?我看不到Dropzone事件,比如说“无错误”来添加点击事件侦听器-我想我已经接近了,但现在半停滞了,我有以下内容:Javascript Dropzone,如果存在错误,如何不处理队列,javascript,jquery,dropzone.js,Javascript,Jquery,Dropzone.js,因此,我有一个带有Dropzone的表单,加上另一个textarea,我想提交-如果我插入了过大的文件或太多,我会在预览容器中出现“过大”错误,等等。但是表单在单击表单提交按钮后会继续处理(由于我的侦听器)。如果两个文件的文件大小都正确且不超过最大文件限制,我如何才能提交?我看不到Dropzone事件,比如说“无错误”来添加点击事件侦听器-我想我已经接近了,但现在半停滞了,我有以下内容: $(function() { var minImageWidth = 300, minImageHeigh
$(function() {
var minImageWidth = 300, minImageHeight = 300;
Dropzone.options.jobApplicationUpload = {
autoProcessQueue: false,
addRemoveLinks: true,
uploadMultiple: true,
paramName: 'file',
previewsContainer: '.dropzone-previews',
acceptedFiles: '.pdf, .doc, .docx',
maxFiles: 2,
maxFilesize: 2, // MB
dictDefaultMessage: '',
clickable: '.fileinput-button',
accept: function(file, done) {
done();
},
// The setting up of the dropzone
init: function() {
var myDropzone = this;
// First change the button to actually tell Dropzone to process the queue.
this.element.querySelector("button[type=submit]").addEventListener("click", function(e) {
// Make sure that the form isn't actually being sent.
if(myDropzone.files.length > 0) {
$('#job-application-container').hide();
$('#spinner-modal').modal('show');
$('#spinner-modal p').html('<b>Sending your application,</b> please wait...</p>');
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
}
});
this.on("success", function(files, response) {
// Gets triggered when the files have successfully been sent.
// Redirect user or notify of success.
$('#job-application-container').hide();
console.log('okay' + response);
localStorage['success'] = 'test';
location.reload();
});
}
};
$(函数(){
var最小宽度=300,最小高度=300;
Dropzone.options.jobApplicationUpload={
自动处理队列:false,
addRemoveLinks:是的,
uploadMultiple:true,
paramName:'文件',
PreviewContainer:“.dropzone预览”,
接受的文件:'.pdf、.doc、.docx',
maxFiles:2,
maxFilesize:2,//MB
默认消息:“”,
可单击:'.fileinput按钮',
接受:函数(文件,完成){
完成();
},
//dropzone的设置
init:function(){
var myDropzone=this;
//首先更改按钮以实际通知Dropzone处理队列。
this.element.querySelector(“按钮[type=submit]”)。addEventListener(“单击”,函数(e){
//确保表单没有实际发送。
如果(myDropzone.files.length>0){
$(“#作业应用程序容器”).hide();
$(“#微调器模式”).model('show');
$('#spinner modal p').html('正在发送应用程序,请稍候…);
e、 预防默认值();
e、 停止传播();
myDropzone.processQueue();
}
});
此.on(“成功”,函数(文件、响应){
//在成功发送文件时触发。
//重定向用户或通知成功。
$(“#作业应用程序容器”).hide();
console.log('ok'+响应);
本地存储['success']='test';
location.reload();
});
}
};
})) 如果要验证dropzone错误,可以检查它包含的被拒绝文件 一个简单的示例(仅限一个文件,最大文件大小为1Mb,使用版本4.3.0): 我希望它对你有用 你好,Yecid
var myDropzone = new Dropzone("div#myDropzone", {
url: "toLoadUrl",
autoProcessQueue: false,
uploadMultiple: false,
maxFiles: 1,
maxFilesize: 1,
init: function() {
this.on("addedfile", function() {
if (this.files[1]!=null){
this.removeFile(this.files[0]);
}
});
}
});
$('#toServerButton').on('click',function(e){
e.preventDefault();
if (myDropzone.files.length == 0){
alert("You should be select any file");
} else if(myDropzone.getRejectedFiles().length > 0) {
alert("The attached file is invalid");
} else {
myDropzone.processQueue();
}
});