Reputation: 677
I am trying to load the JSON and alert it but I am not able to do this simple thing. I am confused have done this before but now it doesn't work. A simple fiddle would be helpful, this is how I tried it:
$.getJSON("https://www.mariyano.com/app-server/test/?action=get_list", function(json) {
alert("JSON Data: " + json.data.id);
});
I am getting the error...
XMLHttpRequest cannot load https://www.mariyano.com/app-server/test/?action=get_list. Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
for this I tried using a callback:
$.getJSON("https://www.mariyano.com/app-server/test/?action=get_list&callback=?",function(json) {
alert("JSON Data: " + json.data.id);
});
and it threw up two errors:
Resource interpreted as Script but transferred with MIME type text/html: "https://www.mariyano.com/app-server/test/?action=get_list&callback=jQuery18205437749766279012_1353579335783&_=1353579335798". jquery-1.8.2.js:8304
Uncaught SyntaxError: Unexpected token :
Upvotes: 0
Views: 383
Reputation: 11714
I think one thing you should understand is the format of your JSON object. From the look of it, it looks like this:
{
"data": [
{"id":"83","name":"asdas"},
{"id":"86","name":"KKKK123"},
{"id":"85","name":"KKKK123"},
{"id":"82","name":"as"},
...],
"status":1,
"error":""
}
You have 3 fields in your JSON object one called data
, one called status
, and one called error
. Let's focus on the data
field. It seems to be a giant array with objects at each index, each object containing fields including id
and name
.
Looking back at your code, you are trying to print json.data.id
. The json.data
is fine but when you say id
... well it doesn't know which id
it should be looking at so that's why it throws a syntax error.
the field data
is an array so if you wanted to access a specific id
you'd have to do
json.data[0].id
and that'd give you the first index's id
.
This at least explains the Uncaught SyntaxError: Unexpected token :
.
Upvotes: 1
Reputation: 944321
You can't access data on another domain without circumventing the same-origin policy.
You can't use JSONP to do that unless the service you are accessing supports JSONP, which https://www.mariyano.com/app-server/test/
doesn't.
Upvotes: 2
Reputation: 1114
Follow this code it may help you
<!DOCTYPE html>
<html>
<head>
<style>img{ height: 100px; float: left; }</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="images">
</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
{
tags: "mount rainier",
tagmode: "any",
format: "json"
},
function(data) {
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});</script>
</body>
</html>
Upvotes: -2