如何动态更改dropezone.js中的url选项

时间:2017-01-16 08:26:12

标签: javascript dropzone.js

我正在第一次使用dropzone.js上传多个文件....但我遇到了一些问题.... 基本上我想要实现的是针对会议ID上传多个文件我有一个表单,其中有一个名为meeting_id的输入字段,然后我以编程方式创建dropezone。 下面是我的javascript代码

        Dropzone.autoDiscover = false;
        jQuery(document).ready(function() {
        var arr=JSON.parse('<?echo $json_ext_arr?>').toString();
        var myDropzone = new Dropzone("#myId", {
        url:'upload.php',
        autoProcessQueue:false,
        maxFiles:5,
        acceptedFiles: arr
       }); 

      });

          var meeting_id=$('#meeting_id).val()

现在我想要的是我想改变dropezone的网址,如

         url:'upload.php?meeting_id='+meeting_id+'';

其中meeting_id是input_text名称的值,作为meeting_id

2 个答案:

答案 0 :(得分:1)

如果我理解你的问题,我相信这就是你所追求的:

    Dropzone.autoDiscover = false;
    jQuery(document).ready(function() {
                var arr = JSON.parse('<?echo $json_ext_arr?>').toString();
                var myDropzone = new Dropzone("#myId", {
                    url: 'upload.php?meeting_id=' + $("#meeting_id").val(),
                    autoProcessQueue: false,
                    maxFiles: 5,
                    acceptedFiles: arr
                });

或者你可以这样做:

myDropzone.options.url = 'upload.php?meeting_id=' + $("#meeting_id").val()

答案 1 :(得分:1)

我在尝试在下拉列表选项更改时动态更新网址时遇到此问题。但是,在DOM准备就绪后更改它时,它不起作用。

每次我更改下面的选项时,我都可以动态加载Dropzone来解决这个问题。

步骤1:在html中定义div容器,如下所示

<div id="dzContainer">
<!--  Drag and Drop control is dynamically placed here to upload files to databse -->
</div>

步骤2:使用Dropzone控件填充div以上

function ReloadDropZone(optionName) {

            //Create <div class="dropzone" id="dropzoneForm">
            var iDiv = document.createElement('div');
            iDiv.id = 'dropzoneForm';
            iDiv.className = 'dropzone';
            document.getElementById('dzContainer').appendChild(iDiv);

            // Create <div id="innerDiv" class="fallback">
            var innerDiv = document.createElement('div');
            innerDiv.id = 'innerDiv';
            innerDiv.className = 'fallback';
            document.getElementById('dropzoneForm').appendChild(innerDiv);

            /// Create <input name="file" type="file" multiple/>
            var iInput = document.createElement('input');
            iInput.name = 'file';
            iInput.type = 'file';
            iInput.id = 'inputFile';
            document.getElementById('innerDiv').appendChild(iInput);
            document.getElementById('inputFile').setAttribute('multiple','multiple');

            ///<input type="submit" value="Upload" />
            var iSubmit = document.createElement('input');
            iSubmit.value = 'Upload';
            iSubmit.type = 'submit';
            document.getElementById('innerDiv').appendChild(iSubmit);

            // Dropzone class:
            $("div#dropzoneForm").dropzone({
                url: 'apiurl' + optionName,
                dictDefaultMessage: "",
                autoDiscover: false,
                maxFiles: 2000,
                maxFilesize: 0.2,
                acceptedFiles: ".jpeg,.jpg,.png",
                complete: function (file){},
                error: function (file, response) {},
                init: function () {}
            });
}