Javascript 在每次文件上传时使用 dropzone.js 发送自定义数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29073878/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Send custom data with dropzone.js on each File Upload
提问by Abhinav
I am using dropzone in my Code Igniter Project.
我在我的 Code Igniter 项目中使用 dropzone。
With every drag of a file, dropzone creates an ajax request and my files is getting stored on the server too. But now, my requirement is that I want to send additional data (DYNAMIC) alongside the file. With the use of params, Only static datas can be sent, but the data I want to send will be changing everytime.
每次拖动文件时，dropzone 都会创建一个 ajax 请求，我的文件也被存储在服务器上。但是现在，我的要求是我想在文件旁边发送额外的数据 ( DYNAMIC)。使用params，只能发送静态数据，但是我要发送的数据每次都会发生变化。
This is how my code looks:
这是我的代码的样子：
<script>
Dropzone.autoDiscover = false;
Dropzone.options.attachment = {
init: function(){
this.on('removedfile',function(file){
// console.log('akjsdhaksj');
var fileName = file.name;
$.ajax({
type: 'POST',
url: "<?php echo BASE_URL.'index.php/admin/mail_actions/deleteFile' ?>",
data: "id="+fileName,
dataType: 'html'
});
});
},
// params: {
// customerFolder: $('#toValue').substr(0, toValue.indexOf('@')),
// },
dictDefaultMessage:"Click / Drop here to upload files",
addRemoveLinks: true,
dictRemoveFile:"Remove",
maxFiles:3,
maxFilesize:8,
}
$(function(){
var uploadFilePath = "<?php echo BASE_URL.'index.php/admin/mail_actions/uploadFile' ?>";
var myDropzone = new Dropzone("div#attachment", { url: uploadFilePath});
});
</script>
Anyway I can achieve it?
反正我能做到吗？
回答by Abhinav
I got it. This is what I had to use
我知道了。这是我必须使用的
myDropzone.on('sending', function(file, xhr, formData){
formData.append('userName', 'bob');
});
回答by Stan
Abhinav has the right and working answer I only want to give a second option to use it in the options object (for example if you have multiple Dropzone sections on one page.)
Abhinav 有正确且有效的答案，我只想提供第二个选项以在选项对象中使用它（例如，如果您在一页上有多个 Dropzone 部分。）
myDropzone.options.dropzoneDivID = {
sending: function(file, xhr, formData){
formData.append('userName', 'Bob');
}
};
回答by Achim Koellner
In case you have a nested payload object - e.g. to add a name to your file and your api only accepts something like this
如果您有一个嵌套的有效负载对象 - 例如向您的文件添加一个名称并且您的 api 只接受这样的东西
{
someParameter: {
image: <my-upload-file>,
name: 'Bob'
}
}
your dropzone setup would look like this
你的 dropzone 设置看起来像这样
var myDropzone = new Dropzone("div#attachment", {
url: uploadFilePath,
paramName: 'someParameter[image]'
});
myDropzone.on('sending', function(file, xhr, formData){
formData.append('someParameter[image]', file);
formData.append('someParameter[userName]', 'bob');
});
I only added this as there was no example for nested parameters documented since now.
我只是添加了这个，因为现在没有记录嵌套参数的示例。
