How to make a progress bar from PHP download

Asked

Viewed 3,098 times

-3

I have a website to upload and download files, I want to make a progress download similar to the Mega, take a look at the download page: page .. I’ve tried to do more I couldn’t, can someone please help me?

php jquery
  • 6

    Hi, welcome to [en.so]. Please check out the [Ask] guide. Best you show what you tried and what you found during your search for the problem.

1 answer

4

You can use the ajax function of jquery or the form plugin too, it is quite simple to use the plugin, try this:

About ajax in jquery you can see more here: http://api.jquery.com/jquery.ajax/

Jsfiddle from jquery form plugin example: http://jsfiddle.net/W3AmK/

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script>
(function() {

var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');

$('form').ajaxForm({
    beforeSend: function() {
        status.empty();
        var percentVal = '0%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    uploadProgress: function(event, position, total, percentComplete) {
        var percentVal = percentComplete + '%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    success: function() {
        var percentVal = '100%';
        bar.width(percentVal)
        percent.html(percentVal);
    },
    complete: function(xhr) {
        status.html(xhr.responseText);
    }
}); 

})();       
</script>
<div class="progress">
    <div class="bar"></div >
    <div class="percent">0%</div >
</div>

<div id="status"></div>

Browser other questions tagged php jquery

You are not signed in. Login or sign up in order to post.