如何使用不同的按钮提交 dropzone.js

Question

我正在使用 dropzone.js 和 Laravel。

我使用两个不同的按钮提交文件（见下图）。

当单击 合并并上传为一个文件时，我想将此按钮值发送到控制器。

当分别保存每个文件点击时我要发送这个按钮值控制器

我使用了一个 input 的全局变量，它工作正常，但问题是当我按下按钮时它发送旧值而不是当前值。

感谢您的帮助。

这是我的表格：

<form action="{{route('mediamanager.store')}}" class="dropzone dropzone-nk needsclick" id="my-awesome-dropzone" method="post" enctype="multipart/form-data">
  {{ csrf_field() }}
  <div>
    <i class="notika-icon notika-cloud"></i>
    <div class="fallback">
      <input name="file" type="file" multiple />
    </div>
    <h2>Drop files here or click to upload.</h2>
  </div>
  </div>
  <br>
  <div class="text-center">
    <input type="button" class="btn-success submit-merge" id="merge_file" value="Merge and Upload as one file" style="padding:0.8em">

    <input type="button" class="btn-success submit-separate" id="separate_file" value="Save each file separatly">
  </div>
</form>

这是放置区的脚本：

<script>

Dropzone.options.myAwesomeDropzone = { // The camelized version of the ID of the form element

    // The configuration we've talked about above
    autoProcessQueue: false,
    uploadMultiple: true,
    parallelUploads: 25,
    maxFiles: 25,
    acceptedFiles:'.pdf',

    // The setting up of the dropzone
    init: function() {
        var myDropzone = this;
        var input = 'Null';


        $(".submit-merge").click(function (e) 
        {
            alert('
                    <input >
            ');
            e.preventDefault();
            e.stopPropagation();
            myDropzone.processQueue();

            input = 'merge_file';

            console.log(input);
        });



        $(".submit-separate").click(function (e) {
            e.preventDefault();
            e.stopPropagation();
            myDropzone.processQueue();

            input = 'separate_file';
            console.log(input);
        }); 
        // });

        // $(".submit-separate").click(function (e) {
        this.on("sendingmultiple", function(file, xhr, formData) {
        //Add additional data to the upload
            formData.append(input, $('#'+input).val());
        });

        this.on("success", function(file, responseText) {
            // location.reload();
            console.log('dfd');
        });

    }
}

</script>

Answer 1

您正在 processQueue() 之后更改输入值。

代替

    $(".submit-merge").click(function (e) {
        alert('
                <input >
        ');
        e.preventDefault();
        e.stopPropagation();
        myDropzone.processQueue();

        input = 'merge_file';

        console.log(input);
    });



    $(".submit-separate").click(function (e) {
        e.preventDefault();
        e.stopPropagation();
        myDropzone.processQueue();

        input = 'separate_file';
        console.log(input);
    });

尝试：

    $(".submit-merge").click(function (e) {
        alert('
                <input >
        ');
        e.preventDefault();
        e.stopPropagation();

        input = 'merge_file';
        console.log(input);

        myDropzone.processQueue();
    });



    $(".submit-separate").click(function (e) {
        e.preventDefault();
        e.stopPropagation();

        input = 'separate_file';
        console.log(input);

        myDropzone.processQueue();
    });

如何使用不同的按钮提交 dropzone.js

how to submit dropzone.js with different buttons

javascript

laravel-5

dropzone.js

dropzone