AJAX call return undefined - ajax

This AJAX call is returning "undefined". I'm not sure what I'm doing wrong and why this isn't working:
var xmlfile;
$.ajax({
type: 'GET',
url: 'sample.xml',
dataType: 'xml',
success: function(data){
xmlfile = $(data);}
});
console.log(xmlfile);

This is likely to be a timing issue since you're referring to the xmlFile variable before the call returns. Instead you have to move the reference into the success callback.
$.ajax({
type: 'GET',
url: 'sample.xml',
dataType: 'xml',
success: function(data){
xmlfile = data;
console.log(xmlfile);
}
});
Try the above.

you can do this by
$.ajax({
type: 'GET',
url: 'sample.xml',
dataType: 'xml',
success: function(data){
xmlfile = data ;}
});
or set the async : false,
you can detect error/problem by debugging so you can see where are you doing wrong
like see alert(data) it it does it mean you are getting successful response by ajax call

var xmlfile;
$.ajax({
type: 'GET',
url: 'sample.xml',
dataType: 'xml',
async : false,
success: function(data){
xmlfile = $(data);}
});
console.log(xmlfile);
try This, you are getting undefined due to asyn call, your log executes before you got result from server

Related

$.getJSON to $.ajax syntax?

I have this working .getJSON
$.getJSON('data3.json', function (data) {
})
If convert to $.ajax What should be the value for data?
$.ajax({
type: 'GET',
url: 'data3.json',
datatype: 'json',
data: ?,
success: function(data) {
}
});
You should try this
In the ajax, they are not compulsory to pass some parameters like data, datatype etc.
So you can call ajax without data parameter
$.ajax({
type: 'GET',
url: 'data3.json',
datatype: 'json',
success: function(data) {
}
});

Weird object returned from AJAX request

I have this method:
var chineseCurrency = getChinese();
function getChinese(){
return $.ajax({
context: this,
type: 'GET',
dataType: 'json',
url: "https://www.cryptonator.com/api/ticker/usd-cny"
});
}
That is what printed when console.log(chineseCurrency);:
I am not able to make chineseCurrency equal to "price", so it would be "6.80071377". How can I do that? Tried chineseCurrency.responseText, nope, chineseCurrency['responseText'], nope. Tried to JSON.parse(chineseCurrency), nope. Nothing works!
Sorry if repeated, couldn't find any answer at Stackoverflow.
How do I return the response from an asynchronous call?
Data that is received as response to asynchronous ajax call cannot be returned from the function that calls $.ajax. What you are returning is XMLHttpRequest object (see http://api.jquery.com/jquery.ajax/) that is far from the desired data.
var chineseCurrency = null;
function getChinese(){
return $.ajax({
context: this,
type: 'GET',
dataType: 'json',
url: "https://www.cryptonator.com/api/ticker/usd-cny",
success: function(data) {
alert("success1: chineseCurrency=" + chineseCurrency);
chineseCurrency = data.ticker.price;
alert("success2: chineseCurrency=" + chineseCurrency);
// do what you need with chineseCurrency
}
});
}
You are not taking the data from that is returned from the Ajax call. instead you are just returning the ajax object.
Change your code to :
$.ajax(
{
context: this,
type: 'GET',
dataType: 'json',
url: "https://www.cryptonator.com/api/ticker/usd-cny"
data :{},
error : function(data)
{
console.log('error occured when trying to find the from city');
},
success : function(data)
{
console.log(data); //This is what you should return from the function.
}
});

recursive ajax or setInterval(), WHICH ONE IS BETTER?

I am trying to fetch the message table and append the response on the previous fetched results...
here are 2 approaches I have tried, but all failed
1st: recursive fetch
function fetch(){
$.ajax({
url: url,
type: "post",
data:data,
timeout: 3000,
success: function(data){
$(selector).append(data);
setTimeout(function(){fetch()},3000);
}
})
}
2nd: setInterval()
setInterval(function(){fetch()},3000);
function fetch(){
$.ajax({
url: url,
type: "post",
data:data,
timeout: 3000,
success: function(data){
$(selector).append(data);
}
})
}
after few successful ajax call, the browser went frozen and console shows "net::ERR_EMPTY_RESPONSE " OR "ERR_CONNECTION_TIMED_OUT"
please advise
thank you
You may this this if you want to make a recursive call after success or failure
function fetch(url, selector){
$.ajax({
url:url,
type:"post",
data:data,
timeout:3000,
success:function(data){
$(selector).append(data);
fetch();
},
error:function(data){
fetch();
}
});
}

Ajax Success Function not working

I am using Ajax to add contents on my database. And here's the code:
function addToFavorites(){
var recipe_id = $("#recipe_id").val();
var url = connect_url+'addFavorite.php?user_id='+user_id+'&recipe_id='+recipe_id;
$.ajax({
type: 'POST',
data: [{
user_id: user_id,
recipe_id: recipe_id
}],
url: url,
async: true,
jsonpCallback: 'userCallback',
contentType: "application/json",
dataType: 'jsonp',
success: function (data) {
alert("HELLO!!!");
},
error: function (e) {
alert("ERROR!");
}
});
}
The Ajax call was successful and I was able to add records on the database but I'm just wondering why is it not displaying the alert message if the calling was successful? Is there something wrong with my code? Or is there something wrong with my understanding? Thanks!
you must give a response with some info to the ajax or it won't know the response succeeded

$.ajax is not working

In my web page there is a textbox to get the scanned barcode value. Once we scan the barcode it has to get details from the database. I am creating the change event for the textbox.
Problem: $.ajax is not working.
Code:
var target = $('#txtBarcode'), val = target.val();
target.change(monitor());
function monitor() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
data: "{}",
url: "HomePage.aspx/SearchProduct",
dataType: "json",
success: function(data) {
alert("Success!!!");
}
});
}
You are trying to pass 'monitor' to the change method but you're actually calling it. It should look like this (no parens)
var target = $('#txtBarcode'), val = target.val();
target.change(monitor);
function monitor() {
You can always declare it inline too:
var target = $('#txtBarcode'), val = target.val();
target.change(
function() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
data: "{}",
url: "HomePage.aspx/SearchProduct",
dataType: "json",
success: function(data) {
alert("Success!!!");
}
});
});
Add an error handler.
Make sure your relative URL is right.
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
data: "{}",
url: "HomePage.aspx/SearchProduct",
dataType: "json",
success: function(data) {
alert("Success!!!");
},
error: function(XMLHttpRequest, textStatus, errorThrown)
{
// ...
}
});
EDIT: Dan is right about your change handler.
You can copy some answers posted here, and at least one of will likely to work, but you won't get the intimate knowledge of why. Here's an additional way:
Since you use asp.net, put the break point in the first line of HomePage.aspx/SearchProduct. This ensure that the request goes to the right URL on the server.
Step all the way through this method to make sure there's no exception that gets thrown.
Use FireFox and install Firebug (even if you target IE and have no intention to make it run on FF). You can inspect the http response.
Add an error handler in addition to the success handler.

Resources