使用 Dropzone javascript 框架上传文件时传递额外的文本字段值

passing an additional textfield value when uploading files using Dropzone javascript framework

您好,我开发了一个使用 Dropzone javascript 框架上传图片的网页。

我可以正常工作,但我还打算在上传此文件时发送一些额外的文本字段数据。

我做了一些检查,发现下面这个 link 堆栈溢出,但似乎没有用


所以我决定 post 我所做的事情,希望其他人可以更正我的代码以帮助我使它工作

 <head>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/dropzone.js"></script>

</head>



<form id="my-form" name="wle">

     <input type="hidden" value="wole" id="collect" name="collect" />
<div class="dropzone"></div>


<button id="startUpload">Upload</button>

</form>



<script>

    Dropzone.autoDiscover = false;

    $(document).ready(function () {
        var myDropzone = new Dropzone(".dropzone", {
            init: function () {

                $('#startUpload').click(function () {
                    myDropzone.processQueue();
                });
            },
            url: "upload.php",
            type: 'POST',
            autoProcessQueue: false,
             maxFilesize: 20,
  paramName: "file",
        maxFiles: 5,
        addRemoveLinks: true,
        acceptedFiles: ".jpg,.JPG.jpeg,.JPEG,.PNG,.png,.gif",

        //send all the form data along with the files:


            success: function () {
                //do stuff
            },
            error: function () {
                //do error notification
            }


        });
    });


</script>

以上代码可以上传文件,

但后来我尝试传递一个额外的数据字段,我需要使用它保存在数据库中

 this.on("sendingmultiple", function(data, xhr, formData) {
            formData.append("collect", jQuery("#collect").val());

        });

但是 Dropzone 元素停止工作

为了说唱这一切,我正在尝试上传文件并同时提交文本数据。

请帮忙

经过更多的研究工作,我找到了解决问题的方法

有一个函数允许发送更多的参数

myDropzone.on("sending", function(file, xhr, formData) {
  // Will send the filesize along with the file as POST data.
  formData.append("filesize", file.size);
});

在下方找到

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