这是我的问题:我想在用户添加文件时添加输入,但是当我发送文件时没有任何反应,看起来我调用了错误的函数。这是我的 html/js(顺便说一句,这是一个 django 模板)代码:
<form id="myDropzone" action="{% url 'import' %}" method="POST" class="dropzone text-center">
<div id="form_import_div"> </div>
<div class="fallback"> </div></form>
这里是 dropzone 选项代码:
<script type="text/javascript">
// using jQuery
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie !== '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
var csrftoken = getCookie('csrftoken');
ask_job_type(csrftoken);
$("#myDropzone").dropzone({
url:"{% url 'dashboard/import' %}",
maxFilesize: 5000,
addRemoveLinks : true,
dictDefaultMessage: "Drop your log files here or click to upload",
dictResponseError: 'Error uploading file!',
autoQueue:false,
autoProcessQueue:false,
maxFiles: 1,
headers: {
'X-CSRFToken': csrftoken
},
init : function() {
var myDropzone = this;
$("#btn_upload").click(function (e) {
e.preventDefault();
myDropzone.processQueue();
});
this.on('sending', function(file, xhr, formData) {
var data = $('#myDropzone').serializeArray();
$.each(data, function(key, el) {
formData.append(el.name, el.value);
});
});
this.on("successmultiple", function(files, response) {
alert("success");
alert(response);
});
this.on("success", function(files, response) {
alert("success");
alert(response);
});
this.on("errormultiple", function(files, response) {
console.log(response);
});
},
success: function (file, response) {
location.reload();
this.removeFile(file); //todo discuter de quoi faire
}
});
</script>
注意: ask_job_type() 只是对添加所有输入元素的 js DOM 文档函数的调用。我的提交按钮的 ID 为“btn_upload”
我不知道该怎么做,我看过这样的教程: https ://gitlab.com/meno/dropzone/wikis/upload-all-files-with-a-button 但没有任何效果