-4

I am a beginner in working with json so need some help! I have a external json file that attached in a html file with these codes:

{
"reports": [{
        "id": "1",
        "name": "week",
        "type": "bar",
        "size": 12288
    }, {
        "id": "2",
        "name": "month",
        "type": "line",
        "size": 242688
    }]
}

And another external js main.js that attached too. I want to read datas in that json file in main.js in a array for example! what should I do? I have not any access to change the json file.

  • : i have to use pure js !
Sina Merajiyan
  • 11
  • 3
  • 1
    What do you mean, "attached"? The only way to read it at clientside is through AJAX. – Amadan Nov 06 '15 at 09:24
  • What do you mean "read datas" - in a web application? web site? html file? what? – Alex Nov 06 '15 at 09:25
  • @Amadan i mean linked ! – Sina Merajiyan Nov 06 '15 at 09:36
  • what do you want to do with the json? display it? – Alex Nov 06 '15 at 09:38
  • @Alex see my json ! i want an array like myreport that show my data in json . like myreport[1].id=1;! – Sina Merajiyan Nov 06 '15 at 09:41
  • `JSON.parse()` does this do what you want? https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse – Alex Nov 06 '15 at 09:42
  • Hi, i think this link may help you.. http://stackoverflow.com/questions/19706046/how-to-read-an-external-local-json-file-in-javascript – phpfresher Nov 06 '15 at 09:42
  • @Alex probably ! but i cant work with that ! if u can show me an example like my situtaion tnx – Sina Merajiyan Nov 06 '15 at 09:46
  • You're not really giving us enough to work with - you've just pasted some JSON into the question and said "i need to read this" We need to see some more of your intended outcome - like how are you loading this, where is it coming from etc... – Alex Nov 06 '15 at 09:47

4 Answers4

1

Solution using Pure Javascript.

var listreports = new Array();
function init() {
loadJSON(function(response) {
  // Parse JSON string into object
    var actual_JSON = JSON.parse(response);

    for (var prop in actual_JSON){
        tepObj = actual_JSON[prop]; // this is loop into reports, if you have reports2 will be inside
        for (var rep in tepObj){
            temprep = tepObj[rep];
            console.log(temprep)
            var report = new Object();
            report.id = temprep.id
            report.name= temprep.name
            report.type= temprep.type
            report.size= temprep.size
            listreports.push(report);
            console.log(report)
        }

    }
    console.log(listreports);
 });
}


 function loadJSON(callback) {   

    var xobj = new XMLHttpRequest();
        xobj.overrideMimeType("application/json");
    xobj.open('GET', 'test.json', true); // Replace 'test' with the path to your file
    xobj.onreadystatechange = function () {
          if (xobj.readyState == 4 && xobj.status == "200") {
            // Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
            callback(xobj.responseText);
          }
    };
    xobj.send(null);  
 }


init(); //this is only to call the function.

First solution with Jquery

try this

var reports = new array()
$.getJSON( "folder/file.json", function( data ) {
}).success(function(data){
   for (var prop in data){
   temprep= data[prop]
   report.id = temprep.id
   report.name= temprep.name
   report.type= temprep.type
   report.size= temprep.size
   reports.push(report)
  });

then you will have an array of objects with your json

TiGreX
  • 1,602
  • 3
  • 26
  • 41
1

You can store JSON file in a variable in main.js with ajax request:

var xhReq = new XMLHttpRequest();
xhReq.open("GET", ***here the url to your JSON file***, false);
xhReq.send(null);

And then, you can parse that JSON string into a Javascript object to manipulate as an array as you like.

var jsonObject = JSON.parse(xhReq.responseText);
Ramon-san
  • 1,007
  • 13
  • 25
0

If I understand correctly you have a file with the json and another file with your main javascript, if this is right then you need to have the json file above the main.js file in the html.

Then you will be able to get to the json from main.js since when the main.js ks loaded the json file is already loaded, if the main.js is before the json file in the html then you won't have any way to get to that json from main.js

edit: your HTML head should look like this:

<script src="json.js"></script>
<script src="main.js"></script>

Thus, the json file will be known to the main.js file. The others are right that you should have a variable that you put inside it the json, so you will be able to get to from the main.js file.

You do this by this code (assuming you want to call the variable "j"

var j = your_json;
moshe742
  • 1
  • 3
0

if you are loading the json file in the format that you have shown then the json object is not being stored to a variable.

Change your json file to:

var reports = {
"reports": [{
        "id": "1",
        "name": "week",
        "type": "bar",
        "size": 12288
    }, {
        "id": "2",
        "name": "month",
        "type": "line",
        "size": 242688
    }]
};