Get a JSON file from URL and display

LINGS picture LINGS · Jul 12, 2012 · Viewed 96.8k times · Source

The code is very simple, I do not know why it deosnt work.

This is the link to the JSON file, http://webapp.armadealo.com/home.json

Here is the code using getJSON

$.getJSON("http://webapp.armadealo.com/home.json", function(data){
alert(data);
});

I just want the code to display the whole JSON content.

Answer

LINGS picture LINGS · Mar 1, 2013

After so many months of search, I found the solution. Hence, I am answering my own question.

When JSON is not supported and when we are stuck with Same Origin Policy, we have to wrap around our JSON with a padding and make it a JSONP.

To do that, we have a life saving website http://anyorigin.com/

You can paste your URL and get the corresponding JQuery code something like this,

$.getJSON('http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?', function(data){
$('#output').html(data.contents);
});

If you want to use your own code, then just use the URL from the code above, which is

http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?

This above URL will give you the same JSON data as JSONP and solves all the trouble.

I had used the following code, which on success calls displayAll function

$.ajax({
        url: 'http://anyorigin.com/get?url=http%3A//webapp.armadealo.com/home.json&callback=?',
        type: 'GET',
        dataType: "json",
        success: displayAll
    });

function displayAll(data){
    alert(data);
}