title: Internet Explorer 9 randomly not entering the jQuery Ajax done callback
body: <p>I am using Typescript and jQuery ajax in a project. In one of the application pages (something like a dashboard) I have 15 grids, each of them with their WebApi calls and some additional calls to render some comboboxes. Besides this, in my app header I have other components which are requesting data for user and some other comboboxes. In the end, when I'm loading that specific page, the number of ajax calls will reach <strong>24</strong>. </p>
  
  <p>Everything is working fine on Chrome, Mozilla and IE >= 10.
  In IE9, it sometimes happens that <strong>one specific call</strong> from those 24 to not enter the ajax <code>done</code> callback. There is nothing special about this call. In network, the request for it is returning from backend with <code>status 200</code> , so it should enter the callback. The JSON received is valid, the ajax call is the same every time, but it's behaving differently.</p>
  
  <p>If I remove all the other calls and leave only the problematic one, the issue does not occur anymore.</p>
  
  <p>Does IE9 have problems with the number of ajax calls being made in a short period of time?</p>
  
  <p>I am using Typescript and my function which is making the requests is below.</p>
  
  <pre><code>public Request(controllerActionName: string, method: string, data?: Object, headersData?: Object, countRequest: boolean = true) {
          let dataType = "json";
          let headers = _.extend({ "accept": "application/json; odata=verbose" }, headersData);
  
          if (method === "DELETE") {
              dataType = "";
          }
  
          if (BaseWebApi.asyncRequestCount === 0 &amp;&amp; countRequest) {
              PubSub.publishSync(OsiIDs.NotifyAsyncOperation, true);
          }
          console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount + 1));
          countRequest &amp;&amp; BaseWebApi.asyncRequestCount++;
          let response = $.ajax({
              url: this.module + controllerActionName,
              method: method,
              headers: headers,
              contentType: (method.toLowerCase() === "get" ? "" : "application/json"),
              dataType: dataType,
              data: (method.toLowerCase() === "get" ? data : JSON.stringify(data))
          });
  
          response.done(() =&gt; {
              if (BaseWebApi.asyncRequestCount === 1 &amp;&amp; countRequest) {
                  PubSub.publishSync(OsiIDs.NotifyAsyncOperation, false);
              }
              console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount - 1));
              countRequest &amp;&amp; BaseWebApi.asyncRequestCount--;
          }).fail((data, code, message) =&gt; {
              if (BaseWebApi.asyncRequestCount === 1 &amp;&amp; countRequest) {
                  PubSub.publishSync(OsiIDs.NotifyAsyncOperation, false);
              }
              console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount - 1));
              countRequest &amp;&amp; BaseWebApi.asyncRequestCount--;
          });
  
          return response;
      }
  </code></pre>
  
  <p>Will binding the ajax calls solve this ?</p>
  
  <p>Thanks</p>