Dropzone js不会触发ajax调用

问题描述：

您好我正在使用Dropzone工作到我的Dropbox API我想知道为什么我的dropzone无法调用我的ajax请求？我把我的ajax请求放在我的 init：function 中，并认为它会起作用，因为我的按钮功能正常工作。我想知道是否存在逻辑错误或者我错放了我的ajax请求..

Hi I'm currently working in a Dropzone to my Dropbox API I was wondering why is my dropzone cant call my ajax request? I put my ajax request inside of my init:function and thought it will work because the function of my button work. I was wondering if there's a logical error or I just misplaced my ajax request..

 <form id="files" action="/" class="dropzone" name="files[]" ></form>
<input type = "button" id = "btnsubmit" value = "Submit"></input>

这是我的js

Dropzone.options.files = {

    autoProcessQueue : false,
    dictDefaultMessage: "Drop files or click here to upload  file(s) ...",

    init : function() {


        function uploadfiles(upl) {

            var files = upl.target.files;
            var url = "https://content.dropboxapi.com/2/files/upload";

            for (var i = 0, file_name; file_name = files[i]; i++) {

                $.ajax({
                    url: url,
                    type: 'post',
                    data: file_name,
                    processData: false,
                    contentType: 'application/octet-stream',
                    headers: {
                        "Authorization": "ACCESTOKEN",
                        "Dropbox-API-Arg": '{"path": "/' + file_name.name + '","mode": "add"}'
                    },


                    success: function (data) {
                        this.on("processing", function(file) {
                            this.options.url = url;
                            alert('Success Upload');
                        });

                        console.log(data);

                    },
                    error: function (data) {
                        console.log(data);
                    }

                })

            }



            files = this;


            this.on("drop", function(event) {
                console.log(files.files);
            });
            Dropzone.autoDiscover = false;

            $('#btnsubmit').click(function(){
                files.processQueue();

            });

        }
        document.getElementById('files').addEventListener('change', uploadfiles, false);


    }
}

我试过把我的ajax放在里面，如果我的处理，但我认为它doesent读取我的ajax请求

I Tried to put my ajax inside if my processing but I think it doesent read my ajax request

答

Pu你的这个.on（drop，function（event）函数在 Init 函数中并调用你的ajax方法在这个 drop 功能请在下面找到代码段

Pu your this.on("drop", function(event) function inside Init function and call your ajax method to upload image inside this drop function please find below snippet

Dropzone.options.MyDropzone = {
  var FormActionURL;
    init : function() {
      myDropzone = this;
        this.on("drop", function(event) {
           alert("Form Action URL:- "FormActionURL);
           //Put your ajax call here for upload image 
           console.log(myDropzone.files);
        });
    }
};

#drop_zone {
    width: 50%;
    border: 2px dashed #BBB;
    border-radius: 5px;
    padding: 25px;
    text-align: center;
    color: #BBB;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://brightscreentv.net/WAYW/js/dropzone.js"></script>
<div id='drop_zone'>
    <form action="https://content.dropboxapi.com/2/files/upload" class='dropzone' id='MyDropzone'></form>
</div>

Dropzone js不会触发ajax调用

相关推荐