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 268 forks source link

onError fires even though upload occurs #103

Closed DanielFris closed 8 years ago

DanielFris commented 9 years ago

Not sure. onComplete fires but onError takes over and outputs. Using almost exact example code

window.onload = function() {
              var btn = document.getElementById('uploadBtn'),
                  progressBar = document.getElementById('progressBar'),
                  progressOuter = document.getElementById('progressOuter'),
                  msgBox = document.getElementById('msgBox');
              var uploader = new ss.SimpleUpload({
                    button: btn,
                    url: 'include/etrack.fileupload.php',
                    name: 'uploadfile',
                    hoverClass: 'hover',
                    focusClass: 'focus',
                    responseType: 'json',
                    startXHR: function() {
                        progressOuter.style.display = 'block'; // make progress bar visible
                        this.setProgressBar( progressBar );
                    },
                    onSubmit: function() {
                        msgBox.innerHTML = ''; // empty the message box
                        btn.innerHTML = 'Uploading...'; // change button text to "Uploading..."
                      },
                    onComplete: function( filename, response ) {
                        console.log(response);
                        btn.innerHTML = 'Choose Another File';
                        progressOuter.style.display = 'none'; // hide progress bar when upload is completed
                        if ( !response ) {
                            msgBox.innerHTML = 'Server did not respond. Upload failed.';
                            return;
                        }
                        if ( response.success ) {
                            msgBox.innerHTML = '<strong>' + escapeTags( filename ) + '</strong>' + ' successfully uploaded.';
                        } else {
                            if ( response.msg )  {
                                msgBox.innerHTML = escapeTags( response.msg );
                            } else {
                                msgBox.innerHTML = 'Server responded. An error occurred. Upload failed.';
                            }
                        }
                      },
                    onError: function(filename) {
                       console.log(filename);
                       // progressOuter.style.display = 'none';
                       // msgBox.innerHTML = 'Error. Unable to upload file';
                      }
                });
            };
Methos21 commented 9 years ago

@DanielFris i had some problem today, but sucessfully debugged. You should add this function into your file (or somewhere else):

function escapeTags( str ) {
    return String( str ).replace( /&/g, '&amp;' ).replace( /"/g, '&quot;' ).replace( /'/g, '&#39;' ).replace( /</g, '&lt;' ).replace( />/g, '&gt;' );
}

After it will not fire "onError" event when upload was successful.