Javascript 向 Dropzone.js 帖子添加更多数据

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26472952/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-22 22:56:11  来源:igfitidea点击:

Adding more data to Dropzone.js post

javascripttwitter-bootstrapdropzone.js

提问by dmarzio

So I have my implementation of this tutorial here: http://www.dropzonejs.com/bootstrap.html

所以我在这里实现了本教程:http: //www.dropzonejs.com/bootstrap.html

It is working great, and I'm uploading files just fine. What I want to do now is be able to send a user id along with the image in the POST data when Dropzone uploads the image. I did find enyo's tutorial herewhich explains how to add hidden form data to the dropzone, but using the bootstrap tutorial dropzone provides, there is no form and therefore no hidden post data can be sent.

它运行良好,我正在上传文件。我现在想要做的是能够在 Dropzone 上传图像时在 POST 数据中随图像一起发送用户 ID。我确实在这里找到了 enyo 的教程它解释了如何将隐藏的表单数据添加到 dropzone,但是使用 dropzone 提供的引导教程,没有表单,因此无法发送隐藏的帖子数据。

How can I use the code from the bootstrap tutorial linked to above, and yet still send hidden input data to the upload script? Do I have to somehow convert the code provided into a form, and if so, how would I do that?

如何使用上面链接的引导程序教程中的代码,但仍将隐藏的输入数据发送到上传脚本?我是否必须以某种方式将提供的代码转换为表单,如果是这样,我该怎么做?

回答by Egon

It's been a while since you asked this question but based on the dropzone website tips

你问这个问题已经有一段时间了,但基于 dropzone 网站提示

http://www.dropzonejs.com/#tips

http://www.dropzonejs.com/#tips

you should be able to do one of 3 things -

你应该能够做三件事之一 -

1. if there is a form add hidden params.

1.如果有表单添加隐藏参数。

2. you can use params like so -

2.你可以像这样使用参数 -

new Dropzone({
    url: "/",
    params: {
         foo: "bar"
    }
});

3. handle the on sending event like so -

3. 像这样处理发送事件 -

myDropzone.on("sending", function(file, xhr, formData) { 

// Will sendthe filesize along with the file as POST data.

 formData.append("filesize", file.size);  

});

回答by SolarBear

I find the tutorial you're providing a bit confusing since, indeed, there's no form involved. Simply create a form with class="dropzone"and add hidden inputs. It only shows the default template for dropped files and some JS code for basic event handling. I recommend checking out the main Dropzone pagefor examples.

我发现您提供的教程有点令人困惑,因为确实没有涉及任何形式。只需创建一个表单class="dropzone"并添加隐藏的输入。它只显示删除文件的默认模板和一些用于基本事件处理的 JS 代码。我建议查看主要的 Dropzone 页面以获取示例。

For instance, in our code, it looks somewhat like this (redacted a bit) :

例如,在我们的代码中,它看起来有点像这样(稍作修改):

<form action="myAction"
      class="dropzone"
      id="dropzoneId"
      name="pictures">
    <input type="hidden" name="id">
</form>

And, really, that's it. We have some Javascript code to handle the hidden idfield and some fancier features but the id gets posted along with the picture data.

而且,真的,就是这样。我们有一些 Javascript 代码来处理隐藏id字段和一些更高级的功能,但 id 与图片数据一起发布。

回答by NorahKSakal

I know this is a pretty old post but I tried to make the answer of SolarBear to work and it worked for me when adding the parameter "value" to the hidden input like this;

我知道这是一篇很老的帖子,但我试图让 SolarBear 的答案起作用,当将参数“值”添加到这样的隐藏输入时,它对我有用;

<form action="/action.php" class="dropzone">
<input type="hidden" name="additionaldata" value="valueToPass" />
</form>

Thanks for your help!

谢谢你的帮助!