在ajax内部调用ajax

Question

I'm trying to make an ajax call that gets a type of a property. Using that type I then pass it into another ajax call. I'm having some difficulty doing this asynchronously because I'm trying to defer til the first property is loaded.

function getEnt_PodType() {
    var ent_PodType;
    var oDataUrl = //URL to my data;
    return $.ajax({
        url: oDataUrl,
        type: "GET",
        async: true,
        beforeSend: function (xhr) {
            xhr.setRequestHeader("ACCEPT", accept);
        },
        success: function (xhr, textStatus) { 
            var res = xhr;
            if (res.d.results != undefined) {
                ent_PodType = res.d.results[0].Ent_PodType;
            }
            console.log("The ent pod type value is "+ ent_PodType);
            return ent_PodType;
        }
    });
}

function getProjects() {

    var QUERY_FILTER = getEnt_PodType().done(function (result) {
        "$filter=Ent_PodType eq '" + result + "'";
    });

    var url = restUrl + QUERY_FILTER;

    console.log("The url form getProjects is " + QUERY_FILTER);

    return $.ajax({
        url: url,
        type: "GET",
        async: true,
        beforeSend: function (xhr) {
            xhr.setRequestHeader("ACCEPT", accept);
        },
        success: function (xhr, textStatus) {
            projects = parseODataResultTest(xhr);
            return projects;
        }
    });

}

When I call the getProjects(), I thought building the url would wait for getEnt_PodType() to return its value but it doesn't seem to work that way.

Instead it goes ahead and executes the rest of getProjects(). Is there any way to do this asynchronously?

Answer 1

The ajax call needs to be in the done promise. Something like the following should be ok.

function getProjects() {

    return  getEnt_PodType().done(function (result) {
        var QUERY_FILTER = "$filter=Ent_PodType eq '" + result + "'";
        var url = restUrl + QUERY_FILTER;

        console.log("The url form getProjects is " + QUERY_FILTER);

        return $.ajax({
            url: url,
            type: "GET",
            async: true,
            beforeSend: function (xhr) {
                xhr.setRequestHeader("ACCEPT", accept);
            },
            success: function (xhr, textStatus) {
                projects = parseODataResultTest(xhr);
                return projects;
            }
    });
    });

}