Skip to main content

Fire Event Before Upload for jQuery unsigned_cloudinary_upload

Hershey Web Team

I am using the jQuery

unsigned_cloudinary_upload function to upload assets from within a portal to my account. I am trying to fire an event when the upload process begins, but all of the 'start' events such '
fileuploadstart' have a significant lag before firing. It makes it appear to my users like the upload action has failed. Is there an event that fires before the plugin begins its upload work? I want to be able to display a loading gif on this event.
0

Comments

9 comments

Date Votes
  • Shirly Manor

    Hi,

    You can use the pre batch event: https://cloudinary.com/documentation/upload_widget#pre_batch_validation

    Here is a sample code:

    https://jsfiddle.net/shirlymanor/ndgyv467/

    Please let me know if that can work,

    0
  • Hershey Web Team

    Thanks for replying , Shirley. I am not using the upload widget, but rather calling the 'unsigned_cloudinary_upload' function on a customized file element. I was looking for an event I can add to that:

    Here is a clip of my code:

            fileInput.unsigned_cloudinary_upload("########", uploadConfig)
                .bind('fileuploadstart', function(){
                    progressBar.empty().width(0).parent().show();
                    progressBar.css('width', '50%');
                })
                .bind('cloudinarydone', function(e, data) {
                    // Upload complete
                    handleCloudinaryComplete($(widget), data);
                }).bind('cloudinaryprogress', function(e, data) { 
                    progressBar.css('width', Math.round((data.loaded * 100.0) / data.total) + '%'); 
                });
     
    The current 'fileuploadstart' event fires the same time as the 'cloudinaryprogress' event, which is not helpful. I need an event that acts before any upload actions occur.
     
    Thanks!
    0
  • Shirly Manor

    Hi,

    You can try bind `fileuploadstart`. Here is a sample code for you:

    https://jsfiddle.net/shirlymanor/ay84tf5b/

    Please let us know if that works,

    Shirly

    0
  • Hershey Web Team

    Shirley, as noted in my previous response and sample code, I am already binding 'fileuploadstart' and it does not work. For some reason fileuploadstart fires at the same time (with milliseconds) as the complete function. I was hoping for something sooner. If there is nothing, I will continue to look for an alternate solution.

     

    Thanks

    0
  • Shirly Manor

    Right, however, in the code that I've shared it print the event and you can see that it prints the `fileuploadstart` before the progress and done. it indeed depends on the upload and all the processes can be fast.

    0
  • Hershey Web Team

    Yes. Whenever the file is selected the browser goes into a very laggy state where it looks like everything locked up, causing some users to panic and do bad things. After this lag then the events start to fire. I was hoping to get an event where I can throw up a gif and notice before it hits the lag. I am trying to look for a creative solution. I appreciate your time.

    0
  • Shirly Manor

    You might want to try the input change event. For example: https://stackoverflow.com/questions/23424417/file-upload-control-onchange-event-jquery/33904692

    0
  • Jyotis Shetty

    Thank you for sharing the problem I am having.

    0
  • Eyal Katz Talmon

    Hey Jyotis, thanks for reaching out!

    Did you find Shirly's suggestion, of using the input change event, helpful?

    If not, could you kindly provide additional details on the issue you've encountered?
    You may want to open a support ticket here and we'll be happy to assist.

    0

Post is closed for comments.

Didn't find what you were looking for?

New post