How to load, and save local JSON into variable

Question

I am very new to this, trying to follow http://javascriptissexy.com/how-to-learn-javascript-properly/ by making a quiz, any additional advice is welcome. I put the JSON file at the bottom of js as comment.

http://jsfiddle.net/Atlas_/Mgyc5/

Supposed to be the holy grail ? :I

var theQuiz;
$.getJSON("package.json", function (json) {
    theQuiz = json;
});

install firebug for firefox open the console tab and see what error you are getting — Exlord, Jan 01 '14 at 05:31
eathier run your code on a server (exp :wamp local server) or do what @rajesh said — Exlord, Jan 01 '14 at 05:57

score 2 · Answer 1 · answered Jan 01 '14 at 23:35

Thanks guys, i figured it out by checking and rechecking the dev console, but mostly staring at the monitor in disbelief. I actually need help now to get it to work with a server tried few including a local one and no luck.

Valuable Lesson

$.getJSON("package.json", /*loads, if in the same folder*/ function (json) {
theQuiz = json.quiz; // Had to make sure to pick out the array because JSON put it into an extra object
console.log(theQuiz); // object Array
console.log(json);  // object Object
console.log(theQuiz[0].question); // Works! "How many times your heart beats in a day?(choose the closest)"
// but it's not working because js doesn't wait for JSON to load and it starts using the variables that doesn't exist yet
});

Solution

$.ajax({
dataType: "json",
async: false, // Makes sure to wait for load
url: "package.json", //  https://www.dropbox.com/s/fmw63i4v7dtnx6t/package.json
'success': function (json) {
    theQuiz = json.quiz;
    console.log(json);  // object Object
    console.log(theQuiz); // object Array
    // Finishes loading before js starts using it, and works as intended
}
});

score 1 · Answer 2 · answered Jan 01 '14 at 05:29

1

try something like this

JSON FILE[json.js]

 var country = {name:"india",code:"IND"};

HTML FILE

// adding file in script
<script src="json.js"></script>

//using json in script
<script>
  country.name // will give india
</script>

answered Jan 01 '14 at 05:29

rajesh kakawat

10,826
1
21
40

1

This is wrong, country is becoming a global variable. The file is not a json ... does not answer the actual question it's a dirty work around. – code4jhon May 24 '16 at 18:11
The example of JSON FILE is not valid JSON. – Green Sep 28 '22 at 16:45

score -1 · Answer 3 · edited May 23 '17 at 10:29

-1

Using getJSON you can load JSON-encoded data from the server using a GET HTTP request. you cannot load a local file with that function. You can load local file but that is not very easy. Check the below link.

Local file access with javascript

Also please check

Trying to load local JSON file to show data in a html page using JQuery

edited May 23 '17 at 10:29

Community

1
1

answered Jan 01 '14 at 05:22

A Paul

8,113
3
31
61

1

if package.json is in the same folder as the html file this is a valid request(relative path) – Exlord Jan 01 '14 at 05:30
@Exlord - If you check http://api.jquery.com/jQuery.getJSON/. JQuery document tation says "JSON-encoded data from the server". This does not at all talk about the relative path. Let me know if I am missing something. – A Paul Jan 01 '14 at 05:32
ok you could be right i just assumed that he is running the file on a server if he is opening the html file directly then yes getJson dosn't even run – Exlord Jan 01 '14 at 05:55

How to load, and save local JSON into variable

3 Answers3