Reset Uploader after error

[gingerkid77]

Hi

Firstly - plugin is great, simple to use. Thanks.

I have got it working very well in my app. I have an issue though if the upload fails for any reason (interrupted upload, bad URL etc). The onError() function I provide fires, but the upload button remains disabled and the upload cannot be retried.

How do I reset the plugin so an upload can be retried?

Plugin code / config below.

`

    $('.uploadbutton').each(function() {
  var prefix = $(this).data('filetype');

  var btn = document.getElementById(prefix + 'UploadBtn'),
      progressBar = document.getElementById(prefix + 'ProgressBar'),
      progressOuter = document.getElementById(prefix + 'ProgressOuter'),
      msgBox = document.getElementById(prefix + 'MsgBox');

  var extraData = {
          fileType: prefix,
          prevUUID: $('#' + prefix + 'uuid').val()
      };

  var uploader = new ss.SimpleUpload({
      button: btn,
      url: '/v2/upload3',
      name: 'file',
      data: extraData,
      customHeaders: {
          'X-CSRF-TOKEN': $("meta[name='_csrf']").attr("content")
      },
      multipart: true,
      noParams: true,
      multiple: false,
      hoverClass: 'hover',
      focusClass: 'focus',
      responseType: 'json',
      allowedExtensions: ["jpg", "jpeg", "png", "bmp", "pdf", "tiff"],
      maxSize: 4096,
      startXHR: function() {
          progressOuter.style.display = 'block'; 
          this.setProgressBar(progressBar);
      },
      onChange: function(filename, extension, uploadBtn, fileSize) {

      },
      onExtError: function(filename, extension) {
          msgBox.innerHTML = '<strong>' + escapeTags(filename) + '</strong> is not an accepted type. Please select a jpg, jpeg, png, bmp, pdf or tiff file';
          $('#' + prefix + 'uuid').val('');
        },
      onSizeError: function(filename, fileSize) {
          msgBox.innerHTML = '<strong>' + escapeTags(filename) + '</strong> is too large. The maximum filesize is 4Mb.';
          $('#' + prefix + 'uuid').val('');
      },
      onSubmit: function(filename, extension, uploadBtn, fileSize) {

          extraData.prevUUID = $('#' + prefix + 'uuid').val();

          msgBox.innerHTML = ''; // empty the message box
          btn.innerHTML = 'Uploading...'; // change button text to "Uploading..."
      },
      onComplete: function(
          filename,
          response) {
          btn.innerHTML = 'Change File';
          progressOuter.style.display = 'none'; // hide progress bar when upload is completed

          if (!response) {
              msgBox.innerHTML = 'Unable to upload file, no server response';
              btn.innerHTML = 'Upload';
              $('#' + response.fileType + 'uuid').val('').trigger('change');
              return;
          }

          if (response.success === true) {
              msgBox.innerHTML = '<strong>' + escapeTags(filename) + '</strong> successfully uploaded.';
              $('#' + response.fileType + 'uuid').val(response.uuid).trigger('change');

          } else {
              if (response.msg) {
                  msgBox.innerHTML = escapeTags(response.msg);

              } else {
                  msgBox.innerHTML = 'An error occurred and the upload failed.';
              }
          }
      },
      onError: function() {
              progressOuter.style.display = 'none';
              msgBox.innerHTML = 'Unable to upload file, an error occurred';
              btn.innerHTML = 'Upload';
          }
      });

  });

`

[LPology]

At what point in the process is the upload button first disabled?

[gingerkid77]

Hi when a file is submitted. The button is clicked and the onSubmit() method is invoked. The button is disabled and the progress bar is shown. The upload is interrupted (I think) and onError() is invoked but the button remains disabled.

My temporary fix was to call destroy() for the plugin in this event and recreate it. Not the most elegant solution but it works.

[LPology]

Does this work?

onError: function() {
    // other stuff
    this.enable();
}

[gingerkid77]

I'll test and update the ticket

[LPology]

Any update?