how to fetch json data from external file in jquery

Question

I want to fetch all the data from external json file and print in the console, but it is not fetching data to console. Can anyone help me to solve this.

{
"data": 
    {
        "slug": "allsopp-allsopp",
        "id": 401,
        "imageToken": "d045e18526f988cceb63b08e71180fb6595d9f27",
        "name": "Allsopp & Allsopp",
        "location": "Dubai",
        "description": "Allsopp & Allsopp is a family founded property services company operating a traditional UK estate agency model in the United Arab Emirates (UAE). Our mandate is to deliver levels of customer care well above prevailing industry benchmarks, in a rapid and result oriented fashion which adheres strictly to the regulatory framework now governing the local property market. Consequently the staff we employ are expected to follow a business methodology which demands exceptional honesty, a stringent code of business conduct and total transparency to the client. The key objective at Allsopp & Allsopp is to be an all embracing property service centre that caters to all types of property related transactions in the UAE.",
        "residentialForRentCount": 521,
        "residentialForSaleCount": 1114,
        "commercialForRentCount": 1,
        "commercialForSaleCount": 0,
        "commercialTotalCount": 1,
        "totalProperties": 1636,
        "agentCount": 57,
        "licenseLabel": "RERA",
        "licenseNumber": "1815",
        "phone": "+971 4 429 4444",
        "links": {
            "self": "/en/broker/allsopp-allsopp-401",
            "logo": "https://www.propertyfinder.ae/images/pf_broker/logo/d045e18526f988cceb63b08e71180fb6595d9f27/desktop",
            "logo2x": "https://www.propertyfinder.ae/images/pf_broker/logo/d045e18526f988cceb63b08e71180fb6595d9f27/desktop2x"
        }
   }

jquery code

 $(document).ready(function () {
        $.getJSON('data.json', function(data) {
            console.log(data);
        });
    });

Is the `data.json` located at the root of your site? – Nikola Sivkov Oct 24 '16 at 07:03 — Nikola Sivkov, Oct 24 '16 at 07:03
yes it is in my root folder,path is correct – wali Oct 24 '16 at 07:18 — wali, Oct 24 '16 at 07:18

Ponmani Chinnaswamy · Accepted Answer · 2016-10-24T07:10:46.263

1

You can try with below.

Check your json file is placed with application root folder or not. If any other path, Change the JSON URL path in script.
Add JSON.Stringify() in your function.

console.log(JSON.stringify(data));

edited Oct 24 '16 at 07:10

answered Oct 24 '16 at 07:05

Ponmani Chinnaswamy

705
7
21

i have changes to jSON.stringify(),now it also not working – wali Oct 24 '16 at 07:40
Check data is received or not before printing in console. Or add error handling like this. http://stackoverflow.com/questions/1740218/error-handling-in-getjson-calls/19075640#19075640 – Ponmani Chinnaswamy Oct 24 '16 at 08:26
getJSON request failed.....this is the alert message,Can you please check my json link https://www.propertyfinder.ae/en/find-broker/ajax/search?page=1 – wali Oct 24 '16 at 08:49
one more close parenthesis missing. check the JSON. – Ponmani Chinnaswamy Oct 24 '16 at 10:02
Nice. If this answer useful, Don't forget to accept the answer. – Ponmani Chinnaswamy Oct 24 '16 at 11:14

Nabil Ali · Answer 2 · 2017-04-10T16:39:28.867

I know this is more complicated than the accepted answer, but its for people who want to read files using PHP and Javascript (& jQuery).

Javascript Code

$.post('readjson.php', {json_file: 'json.txt'}, function(json){
if (String(json).length > 0){
    console.log(json);
}else{
    console.log("Error Reading File");
}
});

PHP CODE [readjson.php]

if (isset($_POST['json_file'])){
    $data = file_get_contents($_POST['json_file']);
    echo $data;
}

how to fetch json data from external file in jquery

2 Answers2

Javascript Code

PHP CODE [readjson.php]