How to import a json file to parse it

Question

Originally my Json data was in a php file together with code to parse it. They look like:

main.php

<script>
var pdatabase= '{ "pobject" : [' +
'{ "pname":"Pikachu" , "pid":"1" },' +
'{ "pname":"Squirtle" , "pid":"2" },' +  
'{ "pname":"Justinbieber" , "pid":"3" }]}';
</script>
<script>
$(function() {
    ppdatabase = JSON.parse(pdatabase);
    plenth=ppdatabase.pobject.length;
    test=console.log(plenth);
});
</script>

Then I found this is terrible to manage my Json data. So I migrate the Json data to a separate file named "obdatabase.json".

obdatabase.json

var pdatabase= '{ "pobject" : [' +
'{ "pname":"Pikachu" , "pid":"1" },' +
'{ "pname":"squirtle" , "pid":"2" },' +
'{ "pname":"Justinbieber" , "pid":"3" }]}';

In the main.php, after deleting original json data, I made two attempts to access the data and parse it,but failed.

First try

<script src="obdatabase.json"></script>

<script>
$(function() {
    ppdatabase = JSON.parse(pdatabase);
    plenth=ppdatabase.pobject.length;
    test=console.log(plenth);
});
</script>

Second Try

<script>
$.get('obdatabase.json', function(pdatabase) {
    ppdatabase = JSON.parse(pdatabase);
    plenth=ppdatabase.pobject.length;
    test=console.log(plenth);
});
</script>

So how to fix this?

the easy way? your first approach but add a `var ppdatabase = YOUR JSON;` to the start of the file. Save and load it as normal javascript file. (to future commentators - iam aware that this is not the best solution) — Fuzzyma, Feb 14 '16 at 17:10
don't try creating json manually ... there is no need for it and it is very error prone — charlietfl, Feb 14 '16 at 17:14

score 0 · Answer 1 · answered Feb 14 '16 at 17:11

Define the content of the JSON file as

{
    "pobject": [{
        "pname": "Pikachu",
        "pid": "1"
    }, {
        "pname": "squirtle",
        "pid": "2"
    }, {
        "pname": "Justinbieber",
        "pid": "3"
    }]
}

Then use $.getJSON() directly to and no need to use JSON.parse()

$.getJSON('obdatabase.json', function(pdatabase) {
    plenth=ppdatabase.pobject.length;
    test=console.log(plenth);
});

score 0 · Answer 2 · answered Feb 14 '16 at 17:15

0

You are mixing JSON and JSON like object in javascript, JSON can't contain code, it should contain only JSON (e.g {"foo":"bar"})

What you really want is a obdatabase.js file instead of a obdatabase.json

answered Feb 14 '16 at 17:15

Damien Fayol

958
7
17

M.A.K. Ripon · Answer 3 · 2016-02-14T17:24:54.250

See the link. https://jsfiddle.net/bjfu45q4/

var pdatabase= '{ "pobject" : [' +
'{ "pname":"Pikachu" , "pid":"1" },' +
'{ "pname":"squirtle" , "pid":"2" },' +
'{ "pname":"Justinbieber" , "pid":"3" }]}';

OR

var pdatabase = {
    "pobject" : [
         {"pname" : "Pikachu", "pid" : "1"},
         {"pname" : "squirtle", "pid" : "2"},
         {"pname" : "Justinbieber", "pid" : "3"}
    ]
};

var tmpJson = JSON.parse(pdatabase);
console.log(tmpJson.pobject.length);

score 0 · Answer 4 · answered Feb 14 '16 at 17:19

You don't need to stringify that data to use it as a variable just to then convert it to an object using JSON.parse

If you had simply used:

var pdatabase = {
    "pobject" : [
        {"pname" : "Pikachu", "pid" : "1"},
        {"pname" : "squirtle", "pid" : "2"},
        {"pname" : "Justinbieber", "pid" : "3"}]
};

In the file or script tag you would be able to access the object directly

How to import a json file to parse it

4 Answers4