wait for a jquery ajax callback from calling function
You've got to use a callback function. Try this below:
$(function() {
// I think doAjax should doAnAjax()
// here you're passing callback
// but you're not using it doAnAjax()
doAnAjax(Url, data, function(myRtn) {
if (myRtnV == "success") {
resetForm($('#myForm'));
resetForm($('form[name=addChlGrp]'));
} else {
$('.rtnMsg').html("Opps! Ajax Error");
}
});
});
// pass callback as third parameter to doAnAjax()
function doAnAjax(newUrl, data, callBack) {
$.ajax({
url: newUrl,
async: true,
dataType: 'html',
beforeSend: function() {
$('.rtnMsg').html("<img src=_cssStyleImg_-A-loading.gif>");
},
type: "GET",
data: data,
cache: false,
success: function(data, textStatus, xhr) {
$('.rtnMsg').html(data);
myRtnA = "Success"
return callBack( myRtnA ); // return callBack() with myRtna
},
error: function(xhr, textStatus, errorThrown) {
$('.rtnMsg').html("opps: " + textStatus + " : " + errorThrown);
myRtnA = "Error"
return callBack ( myRtnA ); // return callBack() with myRtna
}
});
As previously mentioned, using Callbacks.
function process(url, params, successCallback, errorCallback) {
$.ajax({
success : successCallback,
error : errorCallback,
data : params,
url : url,
type : 'POST',
dataType : 'json'
});
}
process(
'http://www.google.co.uk',
{
param1 : 'a'
},
function(resp) {
alert('Success');
},
function() {
alert('Uh oh');
}
);
You can then pass any function to process
and it will be called on success/error.
The answer is you don't, but it is easily achievable. The idea of AJAX is it is asynchronous, hence the A JAX. This means that the function that originally calls your ajax will not wait for it to complete and instead all work to be completed after an ajax call should be in the success or error handlers.
If you need something to be synchronous you can change your flag from async:true
to async:false
but then it becomes really a SJAX call (not even sure the term exists but, technically it isnt an AJAX call anymore).