Handing value into Success function from AJAX Call - javascript

G'day all,
I'm trying to pass a value through to a Success var from the original AJAX call.
Here's some code :
function isJobComplete(jobGUID) {
var data = { "pJobGUID": jobGUID };
var url = '/DataService.asmx/isJobComplete';
var success = function (response, jobGUID) {
if (response.d) {
//The job is complete. Update to complete
setJobComplete(jobGUID);
}
};
var error = function (response) {
jAlert('isJobComplete failed.\n' + response.d);
};
sendAjax(data, url, success, error);
}
function sendAjax(data, url, success, error) {
$.ajax({
type: "POST",
url: url,
data: JSON.stringify(data),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: success,
error: error || function (response) {
jAlert(response.d);
}
});
}
When the isJobComplete function runs, it has the correct value for jobGUID on the first pass through, but on the return to Success after the AJAX call, jobGUID changes to the word "success", with the double quotes.
How can I pass through that jobGUID to the Success function so I can use it to do more work depending on the AJAX response?
Thanks in advance....

Related

jQuery ajax in ajax request

We have some code(simplified) that looks like bellow. We run function x which does an ajax call. When the call is done we call a different function recalculateOrderObjects which also does an ajax call. When this one is completed, it should output the data that which is obtained via the second call. However, what actually happens is that only the first ajax call is made and the second is not executed (or at least immediately goes to done) but does show the data obtained from the first call as the data obtained from the second one.
When running only the recalculateOrderObjects function the function does work as expected.
Edit 1
The subscription variable is a global
There are no errors on the console
Also, when I first call recalculateOrderObjects independent the function work when first x is called and after that I call recalculateOrderObjects independently the function will not work and shows the same behaviour as when called from `x.'
Edit 2
I tried the suggestion to use successinstead of doneas well. With the same result. recalucateOrderObjects is called succesfully, thought after one executing x the whole ajax call in recalucateOrderObjects is never requested again but instead thinks that it is succesfully executed.
function recalculateOrderObjects() {
$.ajax({
type: 'post',
url: url + "something",
data: {data: subscription}
})
.done(function (data) {
console.log('Data ' + data);
});
}
function x(){
jQuery.ajax({
type: "get",
dataType: "json",
url: url,
async: false
}).done(function (response) {
recalculateOrderObjects();
}
});}
x();
You can't get success responce by ".done" function.
"success" function gives you responce after ajax load.
Please try below code
function recalculateOrderObjects() {
$.ajax({
type: 'post',
url: url + "something",
data: {data: subscription},
success: function(data) {
console.log('Data ' + data);
}
});
}
function x(){
jQuery.ajax({
type: "get",
dataType: "json",
url: url,
success: function(data) {
recalculateOrderObjects();
}
});
}
x();
OR
function x(){
jQuery.ajax({
type: "get",
dataType: "json",
url: url,
success: function(data) {
$.ajax({
type: 'post',
url: url + "something",
data: {data: subscription},
success: function(data) {
console.log('Data ' + data);
}
});
}
});
}
x();

complete callback is not being called for async.parallel

I need to make an api call for 100 rows to populate description (which I prefer to do it in parallel). However some of rows might not have description in this case api will return 404. I need to show a warning message when there are a row or rows without description and remove those rows from modal data which means I need a complete callback or done callback. However the completeCallback is not being called and I "think" it's because some of rows doesn't have description.
Could you please tell me how to achieve that?
Here is my code:
function getDescription(processedData) {
$.ajax({
url: baseApiUrl + '/Summary?id=' + processedData.id,
type: 'GET',
dataType: 'json',
contentType: 'application/json',
success: function (data) {
processedData.SummaryDescription = data;
},
error: function (xhr, status, e) {
if(xhr.statusCode === 404){
processedData.SummaryDescription = '';
}else{
}
}
});
};
//Below line is in a look
parallelCallArray.push(getDescription.bind(null, processedData));
//Below line is out of loop
Async.parallel(parallelCallArray, function(err, result){
console.log('all calls completed...');
});
You're missing the callback parameter of your function(s) that are being executed in parallel. If you don't execute the callback, async will assume your functions haven't finished yet. Try something like this:
function getDescription(processedData, cb) {
$.ajax({
url: baseApiUrl + '/Summary?id=' + processedData.id,
type: 'GET',
dataType: 'json',
contentType: 'application/json',
success: function (data) {
processedData.SummaryDescription = data;
cb();
},
error: function (xhr, status, e) {
if (xhr.statusCode === 404) {
processedData.SummaryDescription = '';
} else {
}
cb(new Error(e));
}
});
}

Callback Issue in JavaScript

I am trying to execute a WCF service call, from function one(). Only once this is complete I want function two() to be executed. The issue I have is that function two() is invoked before function one() completes execution and the WCF service returns the result. How can I solve this please? I am using callback function, so I can't figure out why, given that the response does not exceed 3 seconds.
<script type="text/javascript">
var jsonGetFileResult = "";
function one(callback) {
setTimeout(function() {
//var jsonGetFileResult = "";
console.log('01: into one');
$.ajax({
type: 'GET',
url: ‘http: //wcf.google.com’, //this is the wcf call
contentType: "application/json; charset=utf-8",
dataType: 'json',
data: {},
timeout: 10000,
success: function(data) {
jsonGetFileResult = stringifyNewsletter(data);
console.log('03: ' + jsonGetFileResult);
},
error: function(data) {
alert(error);
}
});
callback();
}, 3000);
}
function stringifyNewsletter(data) {
var removeHeader = JSON.stringify(data);
var file = removeHeader.split('"');
console.log('02: ' + file[3]);
return file[3];
}
function two(linkToNewsletter) {
window.open(linkToNewsletter, '_blank', 'location=yes');
return false;
}
/* now we make use of the callback */
one(function() {
alert(jsonGetFileResult);
// "one" triggers "two" as soon as it is done, note how "two" is a parameter
two(jsonGetFileResult);
});
</script>
You're invoking the callback outside of the ajax "success" function. The $.ajax() call is asynchronous — the call will return to your code essentially immediately, after launching the HTTP request and without waiting for it to finish.
If you move the line
callback();
to inside the "success" handler, then that will run after the HTTP request completes.
You need to put callback inside success function like that:
function one(callback) {
setTimeout(function() {
//var jsonGetFileResult = "";
console.log('01: into one');
$.ajax({
type: 'GET',
url: ‘http: //wcf.google.com’, //this is the wcf call
contentType: "application/json; charset=utf-8",
dataType: 'json',
data: {},
timeout: 10000,
success: function(data) {
jsonGetFileResult = stringifyNewsletter(data);
console.log('03: ' + jsonGetFileResult);
callback();
},
error: function(data) {
alert(error);
}
});
}, 3000);
}

Ajax call returns undefined data

I have an ajax call that requests data from an MVC controller method.
I am returning a Json result from the controller.
Ajax request completes, but the data returned is undefined.Ajax Call
var param = {
"username": uname,
"password": pass
};
var serviceURL = "/Account/CheckUser";
var req = $.ajax({
url: serviceURL,
type: "POST",
data: JSON.stringify(param),
contentType: "application/json",
complete: successFunc,
error: errorFunc
});
function successFunc(data) {
if (data.exists == true) {
console.log("Completed : " + data.exists);
} else {
console.log("Failed : " + data.exists);
}
}
Controller Method
[HttpPost]
public JsonResult CheckUser(string uname, string pass)
{
Boolean cont = true;
return Json(new { exists = cont });
}
Can anyone tell me why exists returns as undefined? UPDATE
As suggested below, I wrote the data to the console, and it seems it's returning an empty string. So I guess the question should be more 'Why is the data returning empty?
The function you specify via the complete option doesn't receive the data (for good reason: it's called even if there is no data, because there was an error). Change complete: to success:.
var req = $.ajax({
url: serviceURL,
type: "POST",
data: JSON.stringify(param),
contentType: "application/json",
success: successFunc, // <=== Here
error: errorFunc
});

Ajax: error callback not firing

I'm having trouble getting the error callback getting called when I pass the error function as an object parameter in a function. However, when I declare it within the ajax code it works.
var ajaxSettings = new Object();
ajaxSettings.error = function(request, status, error){ console.log('bad failure');};
ajaxSettings.success = function(result) { console.log('good success');};
uploadFile(contents, ajaxSettings)
function uploadFile(contents, settings) {
$.ajax({
url: uri,
type: "PUT",
data: contents,
processData: false,
dataType: "json",
success: settings.success,
error: settings.error
});
}
In this case the error callback doesn't get fired. However if I write the error function declaration in the ajax code it works.
function uploadFile (contents, settings) {
$.ajax({
url: uri,
type: "PUT",
data: contents,
processData: false,
dataType: "json",
success: settings.success,
error: function(request, status, error) { console.log('bad failure'); },
});
}
I also tried making success: settings.error and it will call that function when it succeeds. What is the reason the error callback is not getting called?
I created a fiddle using your code check it Fiddle
You should initialize the ajaxSettings before use it
Try to declare your callbacks like below:
var ajaxSettings = {}
ajaxSettings.error = function(request, status, error){ console.log('bad failure');};
ajaxSettings.success = function(result) { console.log('good success');};
... because they are probably not visible in "uploadFile" function scope.

Categories