Javascript - parse JSON looking for object string

Question

I'm creating a webpage which displays data which I have parsed from a JSON. I am using 2 JSON files. One I can parse with no problems however, the second I am struggling with.
I want to be able to parse the JSON looking for a specific object string and return all the other object strings within the same dictionary.

The layout of the JSON is:

{
  "example":[
    {
      "Area":"Inside",
      "Player":"1",
      "Status":1,
      "Start_Time":"2016-12-21",
      "End_Time":"2016-12-22",
    },
    {
      "Area":"Outside",
      "Player":"1",
      "Status":1,
      "Start_Time":"2016-12-24",
      "End_Time":"2016-12-25",
    },
    {
      "Area":"Outside",
      "Player":"2",
      "Status":1,
      "Start_Time":"2016-12-26",
      "End_Time":"2016-12-28",
    }
  ]
}

I want to say

if (player=="1") {//show ALL areas and start and end time}
//output should be something like: Area: Inside, Player: 1, Status: 1, Start_Time: 'Time', End_Time: 'Time', Area: Outside, Player: 1, Status: 1, Start_Time: 'Time', End_Time: 'Time'

I am trying to parse the JSON in javascript, this is how I am parsing the other JSON:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var myObj = JSON.parse(this.responseText);
    var dateTime = myObj.Date;
  }
};
xmlhttp.open("GET", "http://web/server/file.json", true);
xmlhttp.send();

Any help is appreciated.

Check the edits

ellipsis
– ellipsis

2019-02-19 10:01:41 +00:00
Commented Feb 19, 2019 at 10:01 — ellipsis
– ellipsis, Commented Feb 19, 2019 at 10:01

cokenhe · Accepted Answer · 2019-02-19 07:34:17Z

3

You may want to try filter

myObj.example.filter(obj => obj.Player == "1")

// 0: {Area: "Inside", Player: "1", Status: 1, Start_Time: "2016-12-21", End_Time: "2016-12-22"}
// 1: {Area: "Outside", Player: "1", Status: 1, Start_Time: "2016-12-24", End_Time: "2016-12-25"}

answered Feb 19, 2019 at 7:34

cokenhe

416 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ellipsis · Accepted Answer · 2019-02-19 10:00:50Z

0

Using forEach loop

var a={
  "example":[
    {
      "Area":"Inside",
      "Player":"1",
      "Status":1,
      "Start_Time":"2016-12-21",
      "End_Time":"2016-12-22",
    },
    {
      "Area":"Outside",
      "Player":"1",
      "Status":1,
      "Start_Time":"2016-12-24",
      "End_Time":"2016-12-25",
    },
    {
      "Area":"Outside",
      "Player":"2",
      "Status":1,
      "Start_Time":"2016-12-26",
      "End_Time":"2016-12-28",
    }
  ]
};
a.example.forEach(e=>e.Player=="1" && e.Area=="Inside"?console.log(e):false)

edited Feb 19, 2019 at 10:00

answered Feb 19, 2019 at 7:10

ellipsis

12.2k2 gold badges19 silver badges33 bronze badges

4 Comments

JackU Over a year ago

As my json is a seperate file to my javascript would I use var test = myObj.example.forEach(e=>e.Player=="1"?console.log(e):false)

ellipsis Over a year ago

You have to export the JSON from the file and in your js file you have to import it like the following import json from './jsonfile.js'. Then you can use the above code

JackU Over a year ago

Brilliant! Thanks, this works! How would it work if I want when Player=="1" and Area=="Inside". I tried using && as this made most sense to me but I got an error back.

Ben Cooper Over a year ago

forEach is not the canonical solution for this problem. The filter method was created to solve exactly this problem. forEach is a fine (albeit suboptimal) solution to the task of just logging elements that fulfill the condition. However, it doesn't let us do anything with those elements. Additionally, the OP's wording implied that they also wanted help retrieving and readying the JSON for manipulation.

Ben Cooper · Accepted Answer · 2019-02-19 07:47:18Z

-1

You really have two problems here: fetching the JSON and then parsing it to find the data you're interested in. The following snippet takes care of the first task with fetch() (the modern successor to XMLHttpRequest) and the latter task with Array.prototype.filter.

Note that if you're not using a modern javascript environment, this solution will fail. Also note that this could could be improved using the newish async/await. I excluded them for simplicity's sake.

fetch("http://web/server/file.json") // supported in modern browsers.
  .then(res => res.json()) // parses into JSON. Fails if given improper json
  .then(data => {
    console.log(data.example.filter(el => el.Player === 1)); // filter returns an array with only elements that meet the condition
  });

edited Feb 19, 2019 at 7:47

answered Feb 19, 2019 at 7:36

Ben Cooper

1,5653 gold badges11 silver badges22 bronze badges

6 Comments

JackU Over a year ago

I get this error TypeError: data.filter is not a function at fetch.then.then.data

Ben Cooper Over a year ago

Should be fixed - didn't see that your array was nested.

JackU Over a year ago

Had to change Player===1 to Player==="1" and it works! How would I do where I want when Player="1" and Area="Outside"?

Ben Cooper Over a year ago

You would put all your conditions after the arrow (=>). For example: data.example.filter(el => el.Player === "1" && el.Area==="Outside");

JackU Over a year ago

Do you know how to control the error that appears when the json is invalid? see: stackoverflow.com/questions/54904894/…

|

Collectives™ on Stack Overflow

Javascript - parse JSON looking for object string

3 Answers 3

Comments

4 Comments

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

4 Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related