$(document).ready(function(){
/* Union Station */
$.getJSON("http://myttc.ca/Union_station.json?callback=?",
function(data){
if (routes.length > 0) {
$.each(data.stops, function(i,item){
$("#Union").append("<p>Stop Name: " + item.name + "</p>");
$.each(item.routes, function(i,item){
$.each(item.stop_times, function(i,item){
$("#Union").append("<p>Departure Times: " + item.departure_time + "</p>");
$("#Union").append("<p>Shape: " + item.shape + "</p>");
});
});
});
}
});
});
I am getting an empty screen in this
can anyone help to fix this jquery to fetch data from json I only want to display the stop details with departure times
It should be:
function(data){
if (data.stops.length > 0) {
Here's the result of the ajax:
Object {time: 1367157909, stops: Array[8], name: "Union Station", uri: "union_station"}
EDIT:
I guess you need some extra logic then, here's the object:
stops: Array[8]
0: Object
1: Object
2: Object
3: Object
4: Object
5: Object
6: Object
7: Object
agency: "Toronto Transit Commission"
name: "Union Station Subway Platform"
routes: Array[1]
0: Object
name: "Yonge-University-Spadina Subway"
route_group_id: "1"
stop_times: Array[6]
0: Object
departure_time: "10:07a"
departure_timestamp: 1367158079
So you could do something like:
for (var i = 0, l = data.stop.length, stop; i < l; i++) {
stop = data.stop[i];
// If current stop has stop_times then...
if (stop.stop_times.length) {
// do something...
console.log(stop.stop_times);
}
}
Example: http://jsfiddle.net/fBd3s/
routes
is probably not what you're looking for in:
function(data){
if (routes.length > 0) {
At least I can't see where routes
would be set. You probably need
function(data){
if (data.length > 0) {
There is no routes
in the success callbak, so remove that condition
$(document).ready(function(){
/* Union Station */
$.getJSON("http://myttc.ca/Union_station.json?callback=?",
function(data){
$.each(data.stops, function(i,item){
$("#Union").append("<p>Stop Name: " + item.name + "</p>");
$.each(item.routes, function(i,item){
$.each(item.stop_times, function(i,item){
$("#Union").append("<p>Departure Times: " + item.departure_time + "</p>");
$("#Union").append("<p>Shape: " + item.shape + "</p>");
});
});
});
});
});
Demo: Fiddle
Refer the accepted for this question. Which is more specific to Jquery. jsonp with jquery
And API doc will give you lot more information. http://api.jquery.com/jQuery.getJSON/
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.