Progress bar on file upload and information registry

5

I'm developing a project, where I use upload files, as well as an information registry. Both the file and the information are registered in the same form. So far so good, but it's usually that when there is a larger file, it takes about 20 to 30 seconds to upload. Sometimes it takes even longer, and at the moment the project has nothing to indicate the upload progress to the user. Soon, depending on the user, the same may think that nothing happened, and reload the page. That way, I wanted to know how to put a progress bar, modal, or anything, that tells the user that the upload is being performed. How to do this?

    
asked by anonymous 25.07.2015 / 21:23

2 answers

2

I also needed to put some activity indicator in my asp.net application, I got it using jQuery BlockUi.

It blocks the page for the user not to click and displays some image, gif, message so that it knows that it is working during PostBacks.

link

Hug.

    
30.07.2015 / 22:08
1

What you need to do is add an overlay (gif) while your form is being submitted, and hide this overlay when page load is complete.

$(document).ready(function() {
    $("body").prepend('<div id="overlay" class="ui-widget-overlay" style="z-index: 1001; display: none;"></div>');
    $("body").prepend("<div id='aguarde' style='display: none;'><img src='/imagens/loading.gif'/></div>");
});

$('#formulario').submit(function() {
    $("#overlay, #aguarde").show();

    return true;
});

Adapted from the English response link

    
27.07.2015 / 14:37