CODEWITHSUNDEEP
c#jqueryweb-services
user1144596
user1144596

Reputation: 2088

jQuery ajax progress

I am trying to create a progree update module when users save some data from my html5 front end. I have the following code but it does not seem to work. I just don't get any percentcompleted values. Any ideas why this might be failing.

The webservices are c# asmx services.

$.ajax({
    xhr: function()
    {
        if (window.ActiveXObject) {
            return new window.ActiveXObject("Microsoft.XMLHTTP");
        }
        else {
            var xhr = new window.XMLHttpRequest();
            xhr.upload.addEventListener("progress", function (evt) {
                if (evt.lengthComputable) {
                    var percentComplete = evt.loaded / evt.total;
                    //Do something with upload progress
                    console.log(percentComplete);
                    alert(percentComplete);
                }
            }, false);

            xhr.addEventListener("progress", function (evt) {
                if (evt.lengthComputable) {
                    var percentComplete = evt.loaded / evt.total;
                    console.log(percentComplete);
                    alert(percentComplete);
                }
            }, false);
            return xhr;
        }
    },
    type: "POST",
    url: "../service.asmx/SaveSession",
    cache: false,
    contentType: "application/json; charset=utf-8",
    data: JSON.stringify(DTO),
    dataType: "json",
    async:false,
    success: function (response) {
        result = response;
        IsDataDirty = false;
    },
});

Upvotes: 0

Views: 557

Answers (1)

lashab
lashab

Reputation: 186

use code below : 

   {
    xhr: function() {
      var xhr = $.ajaxSettings.xhr();
      if (xhr.upload) {
      xhr.upload.addEventListener('progress', function(e) {
         var percentage = event.loaded / event.total * 100;
              //.....
         }, false);
      }
       return xhr;
      });
    }

Upvotes: 1

Related Questions