LPology / Simple-Ajax-Uploader

Javascript file upload plugin with progress bar support. Works in all major browsers, including IE7+, Chrome, Firefox, Safari, and Opera. No dependencies - use it with or without jQuery.
995 stars 267 forks source link

Drag and drop don’t work on FireFox and IE #134

Closed WilliamCesarSantos closed 8 years ago

WilliamCesarSantos commented 8 years ago

Hi, I'm using the API to load images to my app, but drag and drop don’t work on FireFox and IE after image selection screen is opened. I tried to drag and drop an image for the component area but it is not allowed for the mentioned browsers.

Configuration used

new ss.SimpleUpload({ dropzone : 'cod-div', // HTML element used as upload button button : 'cod-div', // HTML element used as upload button url : _url, // URL of server-side upload handler name : 'arquivo', // Parameter name of the uploaded file multipart : true, hoverClass : 'cod-div-hover', multiple : true, accept : 'image/*', maxSize : 5120, allowedExtensions : ['jpg', 'jpeg', 'png'], onSubmit : function(filename, extension) { // Create the elements of our progress bar var progress = document.createElement('div'), // container for progress bar bar = document.createElement('div'), // actual progress bar fileSize = document.createElement('div'), // container for upload file size wrapper = document.createElement('div'), // container for this progress bar progressBox = document.getElementById('cod--upload-box'); // on page container for progress bars

            // Assign each element its corresponding class
            progress.className = 'cod--upload-progress';
            bar.className = 'cod--upload-bar';            
            fileSize.className = 'cod--upload-size';
            wrapper.className = 'cod--upload-wrapper';

            // Assemble the progress bar and add it to the page
            progress.appendChild(bar); 
            wrapper.innerHTML = '<div class="cod--upload-name">'+filename+'</div>'; // filename is passed to onSubmit()
            wrapper.appendChild(progress);                                       
            wrapper.appendChild(fileSize);
            progressBox.appendChild(wrapper); // just an element on the page to hold the progress bars    

            // Assign roles to the elements of the progress bar
            this.setProgressBar(bar); // will serve as the actual progress bar
            this.setFileSizeBox(fileSize); // display file size beside progress bar
            this.setProgressContainer(wrapper); // designate the containing div to be removed after upload
        },
        onComplete : function(fileName, data){
            var datajson = JSON.parse(data);
            self._buildImagem(datajson);
        }
    });

dropzone

LPology commented 8 years ago

Can you post the HTML you're using?

LPology commented 8 years ago

Should be fixed with version 2.3 release. Closing this out, feel free to reopen or create another issue if you have further problems.