0

I have an issue where I'm using an XHR request, but it's breaking in IE8. My hopes is to extract the XHR call, and the AJAX call, merge them and add them to the $.ajax() function like so:

var loadingXHR = {
    xhr: function () {
        var xhr = new window.XMLHttpRequest;
        xhr.addEventListener('progress', (function (evt) {
            var parentWidth, percent, percentComplete, width;
            if (evt.lengthComputable) {
                width = loadEl.width();
                parentWidth = loadEl.offsetParent().width();
                percent = 100 * width / parentWidth;
                percentComplete = Math.max((evt.loaded / evt.total) * 100, percent);
                loadEl.stop().animate({
                    width: Math.min(percentComplete, 100) + "%"
                }, 120);
            }
        }), false);
        return xhr;
    }
}

var ajaxResponse = {
    type: "POST",
    url: url,
    dataType: "json",
    cache: false,
    contentType: "application/json; charset=utf-8",
    data: data,
    error: function (xhr, textStatus, errorThrown) {
       /* error */
    },
    success: function (model) {
      /* success */
    }
}

if (conditional) {
    return $.ajax($.extend(loadingXHR, ajaxResponse));
}

return $.ajax(ajaxResponse);

However this option doesn't work and my only solution is to create two different AJAX calls and wrap that in a conditional.

Austin
  • 153
  • 1
  • 1
  • 13
  • If you have jQuery, why are you trying to re-invent cross platform Ajax calls. jQuery already has that built-in with `$.ajax()`. Why not just use `$.ajax()`? If you're just trying to get progress messages from your ajax function, then see [What is the cleanest way to get the progress of JQuery ajax request?](http://stackoverflow.com/questions/19126994/what-is-the-cleanest-way-to-get-the-progress-of-jquery-ajax-request). – jfriend00 Jun 16 '16 at 14:35
  • @jfriend00 you're not understanding my question. I am using `$.ajax()` but what I'm trying to do is combine two functions using the `$.extend()` method which creates a new ajax object which I can include in `$.ajax()`. So ideally I have the XHR progress function and the standard ajax call. If the condition is met, combine the two functions and add them together. If not return just the ajax call – Austin Jun 16 '16 at 15:28
  • Did you read the link I provided? It tells you directly how you can add properties or methods to the jQuery ajax object as desired. You can do it conditionally if you want. I don't think you want to be creating a new XHR object - just use the one jQuery has already created. I think you just want to extend the jQuery ajax object. – jfriend00 Jun 16 '16 at 16:22

0 Answers0