How to get response from ajax success call

Question

I want to get response of ajax success call in variable 'response' from where I called function .

Call of function:

 var response = ExecuteAction(Id,Entityname,Processname);

Function:

 function ExecuteAction(entityId, entityName, requestName) {
                $.ajax({
                type: "POST",
                contentType: "text/xml; charset=utf-8",
                datatype: "xml",
                url: serverUrl + "/XRMServices/2011/Organization.svc/web",
                data: requestXML,
                async:false,
                beforeSend: function (XMLHttpRequest) {
                    XMLHttpRequest.setRequestHeader("Accept", "application/xml, text/xml, */*");
                    XMLHttpRequest.setRequestHeader("SOAPAction", "http://schemas.microsoft.com/xrm/2011/Contracts/Services/IOrganizationService/Execute");
                },
                success: function (data, textStatus, XmlHttpRequest) {
                    debugger;
                    if (XmlHttpRequest.status === 200) {
                        var response = $(XmlHttpRequest.responseText).find('b\\:value').text();
                        return response;
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(errorThrown);
                }
            });
}

Please suggest me answer.

Answer 1

This is not how JS asynchronous functions are meant to be used. You should be using callbacks, unless you're using es6 in which you should use promises. But if for some reason you absolutely had to get it to work, you could do something like this (note, i did not test this).

 function ExecuteAction(entityId, entityName, requestName) {
     var response;
     $.ajax({
         type: "POST",
         contentType: "text/xml; charset=utf-8",
         datatype: "xml",
         url: serverUrl + "/XRMServices/2011/Organization.svc/web",
         data: requestXML,
         async: false,
         beforeSend: function(XMLHttpRequest) {
             XMLHttpRequest.setRequestHeader("Accept", "application/xml, text/xml, */*");
             XMLHttpRequest.setRequestHeader("SOAPAction", "http://schemas.microsoft.com/xrm/2011/Contracts/Services/IOrganizationService/Execute");
         },
         success: function(data, textStatus, XmlHttpRequest) {
             debugger;
             if (XmlHttpRequest.status === 200) {
                 response = $(XmlHttpRequest.responseText).find('b\\:value').text();
             }
         },
         error: function(XMLHttpRequest, textStatus, errorThrown) {
             alert(errorThrown);
         }
     });
     while (!response);
     return response;
 }

Here's how to use a callback with the function

function ExecuteAction(entityId, entityName, requestName, callback) {
     var response;
     $.ajax({
         type: "POST",
         contentType: "text/xml; charset=utf-8",
         datatype: "xml",
         url: serverUrl + "/XRMServices/2011/Organization.svc/web",
         data: requestXML,
         async: false,
         beforeSend: function(XMLHttpRequest) {
             XMLHttpRequest.setRequestHeader("Accept", "application/xml, text/xml, */*");
             XMLHttpRequest.setRequestHeader("SOAPAction", "http://schemas.microsoft.com/xrm/2011/Contracts/Services/IOrganizationService/Execute");
         },
         success: function(data, textStatus, XmlHttpRequest) {
             debugger;
             if (XmlHttpRequest.status === 200) {
                 response = $(XmlHttpRequest.responseText).find('b\\:value').text();
                 callback(null, response);
             }
         },
         error: function(XMLHttpRequest, textStatus, error) {
             alert(error);
             callback(error);
         }
     });
 }

called as such

var response = ExecuteAction(Id,Entityname,Processname, function(err, result) {
    if (err) console.log('whoops, error', err);
    console.log('I will print upon completion', result);
});

Answer 2

Your problem is that you are using a sync function when AJAX is async,

you can use a Promise -

return new Promise( (resolve, reject) => {
    $.ajax({
    type: "POST",
    contentType: "text/xml; charset=utf-8",
    datatype: "xml",
    url: serverUrl + "/XRMServices/2011/Organization.svc/web",
    data: requestXML,
    beforeSend: function (XMLHttpRequest) {
        XMLHttpRequest.setRequestHeader("Accept", "application/xml, text/xml, */*");
    XMLHttpRequest.setRequestHeader("SOAPAction", "http://schemas.microsoft.com/xrm/2011/Contracts/Services/IOrganizationService/Execute");
    },
    success: function (data, textStatus, XmlHttpRequest) {
        if (XmlHttpRequest.status === 200) {
            var response = $(XmlHttpRequest.responseText).find('b\\:value').text();
            resolve(response);
        }
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
            reject(errorThrown);
    }
});

and then use it like that

var responsePromise = ExecuteAction(Id,Entityname,Processname);

responsePromise.then( (response) => {
    console.log(response)
},
(error) => {
    console.log(error)
});