mercredi 22 juin 2016

Internet Explorer 9 randomly not entering the jQuery Ajax done callback

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 24.

Everything is working fine on Chrome, Mozilla and IE >= 10. In IE9, it sometimes happens that one call from those 24 to not enter the ajax done callback. In network, the request is returning from backend with status 200 , so it should enter the callback. The JSON received is valid, the ajax call is the same every time, but it's behaving differently.

Does IE9 have problems with the number of ajax calls being made in a short period of time?

I am using Typescript and my function which is making the requests is below.

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 && countRequest) {
            PubSub.publishSync(OsiIDs.NotifyAsyncOperation, true);
        }
        console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount + 1));
        countRequest && 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(() => {
            if (BaseWebApi.asyncRequestCount === 1 && countRequest) {
                PubSub.publishSync(OsiIDs.NotifyAsyncOperation, false);
            }
            console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount - 1));
            countRequest && BaseWebApi.asyncRequestCount--;
        }).fail((data, code, message) => {
            if (BaseWebApi.asyncRequestCount === 1 && countRequest) {
                PubSub.publishSync(OsiIDs.NotifyAsyncOperation, false);
            }
            console.log(controllerActionName + "/" + method + "  ---- prevCount: " + BaseWebApi.asyncRequestCount + "  ---- nextCount: " + (BaseWebApi.asyncRequestCount - 1));
            countRequest && BaseWebApi.asyncRequestCount--;
        });

        return response;
    }

Will binding the ajax calls solve this ?

Thanks




Aucun commentaire:

Enregistrer un commentaire