Передача дополнительного значения текстового поля при загрузке файлов с использованием фреймворка Dropzone Javascript - PullRequest
Новая
       22

Передача дополнительного значения текстового поля при загрузке файлов с использованием фреймворка Dropzone Javascript

1 голос
/ 25 июня 2019

Здравствуйте! Я разработал веб-страницу, которая загружает изображения с использованием JavaScript-инфраструктуры Dropzone.

У меня это работает, но я также собираюсь отправить некоторые дополнительные данные текстового поля при загрузке этого файла.

Я сделал несколько проверок и нашел эту ссылку ниже при переполнении стека, но, похоже, не работает 

https://stackoverflow.com/questions/17872417/integrating-dropzone-js-into-existing-html-form-with-other-fields

, поэтому я решил опубликовать то, что я сделал, с надеждой, что кто-то еще сможет исправить мой кодчтобы помочь мне заставить его работать 

 <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 перестает работать

, поэтому чтобы все это стереть, я пытаюсь загрузить файл и одновременно отправить текстовые данные.

, пожалуйста, помогите

1 Ответ

0 голосов
/ 25 июня 2019

после дополнительных исследований я нашел решение своей проблемы

есть функция, позволяющая отправлять больше параметров 

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
...