I had the following script working two weeks ago in XAMPP, today it doesnt work.
var url = 'http://maps.googleapis.com/maps/api/directions/xml?origin=Chicago,IL&destination=Los+Angeles,CA&waypoints=Joplin,MO|Oklahoma+City,OK&sensor=false';
$.ajax({
type: "GET",
url: url,
dataType: "xml",
async: false,
success: function(xml) {
$(xml).find("route").each(function(){
var startaddresss = $(this).find('start_address').text();
alert(startaddresss);
});
}
});
If i save the XML to XAMPP and call it from AJAX it works fine. What changed in the last two weeks?
Thanks
Cant fix the issue. So i will use PHP to fetch the file and return JSON.
Related
Why is alert saying that the text[0] is undefined?
This is my code:
var text = new Array;
$.ajax({
url: 'engine1/api.php',
data: "",
dataType: 'json',
success: function(rows){
text = rows;
}
});
alert(text[0]);
var text = new Array;
$.ajax({
url: 'engine1/api.php',
data: "",
dataType: 'json',
success: function(rows){
text = rows;
alert(text[0]); // will work, this gets executed after you set text
}
});
//alert(text[0]); << don't put this here, it will get executed right after you send the request
Finally answered my own question, for anyone that comes across this question, here is what I did:
Because ajax is asynchronous, alert(text[0]) is getting executed before text=rows.
You can set ajax to run procedurally like this:
$.ajax({
url: 'engine1/api.php',
data: "",
dataType: 'json',
async: false;
success: function(rows){...
Apperently this is one of the few cases that you can/should set ajax to async:false (because you're serving javascript/jquery to the client).
the following code works fine in FF, opera and chrome but fails in IE
function get_modelo(modelo) {
var selState = modelo;
alert (selState);
console.log(selState);
$.ajax({
url: "site/ajax_call", //The url where the server req would we made.
async: false,
type: "POST", //The type which you want to use: GET/POST
data: "state="+selState, //The variables which are going.
dataType: "HTML", //Return data type (what we expect).
//This is the function which will be called if ajax call is successful.
success: function(data) {
//data is the html of the page where the request is made.
$('#city').html(data);
}
})
}
Can't understand the problem.
console.log in IE doesn't work or causes problems.
See here:
What happened to console.log in IE8?
and here:
Testing for console.log statements in IE
and here:
http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
or just google search IE console log
Everything else in your code looks like it would work fine.
Try this. Below will work in IE8 :P
$.ajax({
url: "site/ajax_call", //The url where the server req would we made.
async: false,
type: "POST", //The type which you want to use: GET/POST
data: { state: selState }, //The variables which are going.
dataType: "html", //Return data type (what we expect).
//This is the function which will be called if ajax call is successful.
success: function(data) {
var newDiv = $('<div></div>');
newDiv.html(data);
newDiv.appendTo("#city");
}
});
Hey all here is my code i have to read an XML file from a Vimeo website:
$(document).ready(function(){
$.ajax({
type: "GET",
url: "http://vimeo.com/api/v2/video/51229736.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('video').each(function(){
var thumbURL = $(this).attr('thumbnail_small');
alert(thumbURL);
$('#vidThumb').html('<img src="' + thumbURL + '">');
});
},
error: function(err) {alert('err');}
});
});
The XML looks like this:
<videos>
<script/>
<video>
<id>51229736</id>
<title>CHATT HISTORY CENTER FILMS CAVALIER</title>
<description/>
<url>http://vimeo.com/51229736</url>
<upload_date>2012-10-11 13:08:51</upload_date>
<thumbnail_small>http://b.vimeocdn.com/ts/353/072/353072229_100.jpg</thumbnail_small>
<thumbnail_medium>http://b.vimeocdn.com/ts/353/072/353072229_200.jpg</thumbnail_medium>
......
</video>
</videos>
Problem being is that it errors out. I'm sure its because of the different domain name trying to read it so how can i fix that in order to do that?
You can not do that through jQuery's ajax across different domains using XML , you can use callback=? to get jsonp response back like in the other answer , if it is possible to get json response from that url
You should have no problem getting an XML response from your server side , you should probably try that route
Achieved it by doing the following:
var vimeoVideoID = '51229736';
$.getJSON('http://www.vimeo.com/api/v2/video/' + vimeoVideoID + '.json?callback=?', {format: "json"}, function(json) {
$("#vidThumb").attr('src', json[0].thumbnail_small);
});
I think the answer is in setting the callback to "?" at least it usually is for me. This at least works with JSON. And if it were JSON, this is how I would do it:
var query = 'http://vimeo.com/api/v2/video/51229736.xml&callback=?';
$.ajax({
url: query,
type: 'GET',
dataType: 'json',
success: function(s) {
console.log('success' + s)
},
error: function(e) { console.log('something went wrong!', e)}
});
I am trying to use the response from a jQuery ajax request to set the innerHTML of a div with a certain id. This is the code I am using:
$(".show_comments").click(function(){
var articleName = $(this).closest("article").find(".articlename").attr('id')
$.ajax({
url: "commentView.php",
data: { 'articleName': articleName },
cache: false,
dataType: "html", // so that it will auto parse it as html
success: function(response){
$(this).closest("article").find(".comments").html(response);
}
});
however it doesn't seem to be doing anything at all, I've tried googling around, but everything I can find says to do it the way I am doing it... I have tested in Firebug and the ajax request is giving me the exact response I want it too... But I just cant access this to set the innerHTML of the div to the response!
In your ajax success handler there is another scope and this points to not what you think. So change your code to:
var articleName = $(this).closest("article").find(".articlename").attr('id'),
that = this;
$.ajax({
url: "commentView.php",
data: { 'articleName': articleName },
cache: false,
dataType: "html", // so that it will auto parse it as html
success: function(response){
$(that).closest("article").find(".comments").html(response);
}
});
What I've changed: I added that variable that points to this instance and use it in the success handler instead.
How would you debug it yourself: if you tried to output console.log(this) and console.log($(this).closest("article").find(".comments")); you would see that it returns a wrong object (in first case) and nothing in second.
As far as I know, $.ajax has always worked pretty smoothly in every browser until now.
I have a pretty simple function, called when a couple of actions from the user occur.
In Firefox, everything runs smoothly. But in Chrome, while the $.ajax request is launched, the callback on success doesn't fire.
Here's the actual snippet:
var form = $("#templateCreator"),
formType = form.attr("method"),
formData = form.serialize(),
action = form.attr('action');
$.ajax({
type: formType,
url: action,
data: formData,
success: function(){
console.log('Can\'t see me in Chrome, but ok in firefox !')
// Handle all form submit events to form validator first
validator(form, targetInput);
}
});
What's puzzling is nothing seems wrong, data is serialized, and sent properly. Does anyone know what I missed?
Start by adding an error and complete method as #Jasper suggested.
$.ajax({
type: formType,
url: action,
data: formData,
success: function(){
console.log('Can\'t see me in Chrome, but ok in firefox !')
// Handle all form submit events to form validator first
validator(form, targetInput);
},
error: function() {
console.log($.makeArray(arguments));
},
complete: function() {
console.log($.makeArray(arguments));
}
});
Then you can:
open Chrome debugger (F12), go to the scripts tag, and put a breakpoint inside success/complete/error; check out the stack trace and values for an epiphany ;)
have a look at the console logs
For great joy, take off every Zig!
I had this issue, and set async: false. This works for me in Chrome. Looks like Chrome has an issue with async: true.
restget = function(url, cb){
$.ajax({
url: url,
dataType: 'json',
crossDomain: true,
async: false,
success: cb
});
Try this .....
data: formData,
async: false,
Chrome has some issues with async calls.
I had a similar problem while trying to get a json array. I had to add dataType: 'json' to my ajax so that non-Firefox browsers know what my data type is. For instance:
$.ajax({
type: 'Get',
url: "http://api.geonames.org/earthquakesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&username=demo",
success: function(data){
var jsonArray = jQuery.parseJSON(data);
alert(jsonArray.status.message);
}
});
and
$.ajax({
type: 'Get',
url: "http://api.geonames.org/earthquakesJSON?north=44.1&south=-9.9&east=-22.4&west=55.2&username=demo",
dataType: 'json',
success: function(data){
var jsonArray = data;
alert(jsonArray.status.message);
}
});
will display the same thing when ran in Firefox firebug. But when you run this in Chrome DevTools it will only work on the bottom one. I hope this fixes your problem.