update progress bar using ajax request seconds

I think this post is quite clear
http://www.dave-bond.com/blog/2010/01/JQuery-ajax-progress-HMTL5/

Posting this for future reference (should the blog be removed):

$.ajax({
     xhr: function(){
       var xhr = new window.XMLHttpRequest();
       //Upload progress
       xhr.upload.addEventListener("progress", function(evt){
       if (evt.lengthComputable) {
         var percentComplete = evt.loaded / evt.total;
         //Do something with upload progress
         console.log(percentComplete);
         }
       }, false);
     //Download progress
       xhr.addEventListener("progress", function(evt){
         if (evt.lengthComputable) {
           var percentComplete = evt.loaded / evt.total;
         //Do something with download progress
           console.log(percentComplete);
         }
       }, false);
       return xhr;
     },
     type: 'POST',
     url: "https://stackoverflow.com/",
     data: {},
     success: function(data){
    //Do something success-ish
    }
 });

Leave a Comment