I am trying to access graphList within success callback, but graphList is undefined. I referred this StackOverflow post. However, I am not able to access elem. Any help would be appreciated.
getGraphData = function (graphList) {
$.ajax({
type: "GET",
url: 'someURL',
beforeSend: function(xhr){},
success: function(result) {
console.log(result);
console.log(graphList);//undefined
}
});
}
Added creating getGraphList function as below, I can access getGraphList inside success callback
var graphList;
var promise = graphInit(response);
promise.done(function(data){
getGraphData(data.graphs)
}
graphInit = function(response,graphList){
getGraphList = function(){return response.graphs;}
}
getGraphData = function (graphList) {
$.ajax({
type: "GET",
url: 'someURL',
beforeSend: function(xhr){},
success: function(result) {
console.log(result);
console.log(graphList);//undefined
graphList = getGraphList();//available
}
});
}
Related
The alert at the start shows "undefined", why?
The alerts come in this order:
"success!"
"Data" (what it should be)
"undefined"
I read through multiple threads, the problem was always that ajax was asynchronous, so the data was not defined when it was accessed, but in my case the data is there, the alert in my function shows the data BEFORE the other alert where it is undefined!
Very grateful for any help!
I got this code
var data = getData("");
alert(data); <<<<<<< UNDEFINED
function getData(fileName) {
$.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
var arrData = processData(data);
alert("success!");
alert(arrData); <<<<< WORKS GREAT
return arrData;
},
});
}
function processData(data) {
var arrData = CSVToArray(data);
dimensions = arrData[0];
var objects = [];
objects[0] = dimensions;
for (var i = 1; i < arrData.length; i++){
objects[i] = new Object();
for (var j = 0; j < dimensions.length; j++){
objects[i][dimensions[j]] = arrData[i][j];
}
}
return objects;
}
To clarify, I know asynchronous is the way to go for user experience, but this page just has to show data from this call, so its okay for me to wait for it.
Your getData function doesn't return anything.
You need to return it from the function itself.
function getData(fileName) {
$.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
var arrData = processData(data);
alert("success!");
alert(arrData); <<<<< WORKS GREAT
return arrData;
},
});
}
^ This returns the data within getData. But getData doesn't do anything with it: such as returning it.
function getData(fileName) {
var ourData = "";
$.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
var arrData = processData(data);
ourData = arrData;
},
});
return ourData;
}
This returns the data from getData to whatever calls that function.
edit: also, don't use async:false. Your browser won't capture any events happening until that AJAX completes. The benefit of asynchronous JS is that...we can! And in this case should.
Preface: Don't use async: false. But answering the question:
getData doesn't return anything. You're doing a return from the success callback, but that returns something from the success callback, not getData.
To change it so getData returns something, you'd do this:
function getData(fileName) {
var arrData;
$.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
arrData = processData(data);
},
});
return arrData; // <=== Now `getData` returns something
}
But don't do that. Instead, embrace asynchronous programming and remove async: false. For instance, a callback:
function getData(fileName) {
$.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
callback(processData(data));
},
});
}
...called like this:
getData(function(data) {
alert(data);
});
...or a promise ($.ajax returns one, of sorts):
function getData(fileName) {
return $.ajax({
async:false,
type: "GET",
url: "breastCancer.csv",
dataType: "text",
success: function (data) {
callback(processData(data));
},
}).then(data) {
return processData(data); // <== Becomes the resolution value of `getData`'s promise
});
}
and then
getData().then(function(data) {
alert(data);
});
data is undefined because the function getData doesn't return anything. You should have a look at promises.
I found this question which is almost exactly the same: Return value from nested function in Javascript
The problem is that the function is passed to jQuery's $.ajax function. Here's what i have:
function doSomething() {
// Do some stuff here
console.log(getCartInfo());
}
function getCartInfo() {
var url = blog_location + '?reqCartData=1';
$.ajax({
url: url,
type: 'get',
success: function(data) {
return data; <------------- This
}
});
}
I need to return data to the doSomething function, if that makes sense. I tried to return the entire $.ajax function but that returned the whole object. Any ideas?
Send a callback function:
function getCartInfo(onSuccess) {
var url = blog_location + '?reqCartData=1';
$.ajax({
url: url,
type: 'get',
success: function(data) {
onSuccess(data);
}
});
}
getCartInfo(function(data) {
console.log(data);
});
try this
function doSomething(date) {
........your data
}
function getCartInfo() {
var url = blog_location + '?reqCartData=1';
$.ajax({
url: url,
type: 'get',
success: function(data) {
doSomething(data);
}
});
}
Hi I am trying to get a return value from a get function from a jquery Get request on success.
I have tried many ways already but with no success. Two forms which i have tries are:
1)
GetResultOutput = function () {
var outPut = "No Data Found";
var test = test();
return test["outPut"];
}
test = function()
{
outPut = "No Data Found";
**return** $.ajax({
type: "GET",
url: serviceUrl,
dataType: "xml",
success: function (xml) {
outPut = "done";
}
});
}
2)
GetResultOutput = function () {
outPut = "No Data Found";
$.ajax({
type: "GET",
url: serviceUrl,
dataType: "xml",
success: function (xml) {
outPut = "done";
}
});
return outPut;
}
But both of them is not giving me any result..
2nd one outputs me as no data found. and 1st one which is preferred one when googled...results as undefined
Instead of trying to get the output and then process it like:
var output = GetResultOutput();
process(output);
You could pass process as a callback like:
var GetResultOutput = function (callback) {
$.ajax({
type: "GET",
url: serviceUrl,
dataType: "xml",
success: function (xml) {
callback(xml);
}
});
};
// usage:
GetResultOutput(process);
You can also make your ajax call synchronous by using:
$.ajax({
type: "GET",
url: serviceUrl,
async: false,
dataType: "xml",
success: function (xml) {
outPut = "done";
}
});
Ajax request are asynchronous, which means you cannot immediately "return" data from the call. That is why all forms of $.ajax take one or more callbacks to be called when data is received, or an error occurs etc.
Which means your method must look like:
GetResultOutput = function (callback) {
$.ajax({
type: "GET",
url: serviceUrl,
dataType: "xml",
success: callback
});
}
with callback looking like:
function callback(xml)
{
console.log('done: ' + xml);
}
I'm trying to get my function to return the data it got into another function but it doesn't seem to work? How can I get it to return the data?
function playerid(playername) {
$.ajax({
type: "POST",
url: "fn.php?playerid",
data: "playername="+playername,
success: function(data) {
//$("#test").text(data);
return data;
}
});
}
I want to use it in another function like this
showBids(playerid(ui.item.value));
function showBids(playerid) {
$.ajax({
type: "POST",
url: "poll.php?",
async: true,
dataType: 'json',
timeout: 50000,
data: "playerid="+playerid,
success: function(data) {
//.each(data, function(k ,v) {
//})
//$("#current_high").append(data);
setTimeout("getData()", 1000);
}
});
First of all, your playerid() does not return anything, so what do you want to use? It has only $.ajax() call in it, no return statement (one of the callbacks in $.ajax() has return statement, but see below).
Secondly, JavaScript does some things asynchonously, otherwise every interface element would need to wait to react to user action until the AJAX call returns from the server.
Use event-based approach, by passing callbacks to some functions. Then, after they finish, just call the callbacks passing them the result:
function getplayerid(playername, callback) {
$.ajax({
type: "POST",
url: "fn.php?playerid",
data: "playername="+playername,
success: function(data) {
//$("#test").text(data);
callback(data);
}
});
}
and then use it like that:
getplayerid(ui.item.value, showBids);
(notice function name change since it does not actually return player ID, it gets it and passes it to callback)
You could try to use syncronous Ajax:
function playerid(playername) {
return $.ajax({
type: "POST",
url: "fn.php?playerid",
data: "playername="+playername,
async : false //making Ajax syncronous
}).responseText;
}
Otherwise you need to use showBids function as callback:
function playerid(playername, callback) {
$.ajax({
type: "POST",
url: "fn.php?playerid",
data: "playername="+playername,
success: function(data) {
callback(data);
}
});
}
//Usage
playerid(ui.item.value,showBids);
I have this function
function onclickRowRecord(recordID) {
$.ajax({
type: "POST",
url: '/file/to/post.to.php' ,
data: {recordID:recordID},
success: function(data) {
//how to post this to function howToPost(recordID) the recordID
}
});
}
function howToPost(recordID){
alert(recordID);
}
so how can I get the response from ajax success and post to the other function
If post you mean call the hotToPost function, then
...
success: function(data) {
howToPost(data.recordID); //or whatever
}
....
Hope this helps.
$.ajax({
type: "POST", url: '/file/to/post.to.php' , data: {recordID:recordID}, success: function(data) {
alert(recordID)
}
});
Does that work? Kinda new to jQuery