Searching items on an array JSON

Question

I'm working on vanilla js since I'm not allowed to use jQuery at all, so I'm pretty much a beginner so I wanted a guide, I'm trying to get the email address from a JSON file I've tried doing a loop but it never gets to the attribute email and displays it.

I have tried this :

I search through an input text and get the value and store it in textValue then I try looking for that value with a for-loop.

var textValue = document.getElementById("email").value;
  for(var i = 0; i < localStorage.getItem(jsondata.data.length); i++)
{
  if(jsondata[i].email == textValue)
    {
      console.log(jsondata[i].email) 
    }
}
 };

This is how the JSON looks:

{
  "data": [
    {
      "email": "nicobes@gmail.com",
      "name": "Nickole Beatrice Smith",
      "address": "398 Pleasant Pine Cir. Harrington, DE 19123",     
      "age": 45,
      "notes": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, ",
      "phoneNumbers": [
        {
          "phone": "(302) 792-8434"
        },
        {
          "phone": "(302) 792-1134"
        },
        {
          "phone": "(302) 792-2234"
        },
        {
          "phone": "(302) 792-3334"
        }
      ],
      "relatives": [
        {
          "name": "Susan M Smith"
        },
        {
          "name": "Malcolm W Smith"
        },
        {}
      ]
    }

sarkiroka · Answer 1 · 2019-06-30T20:19:53.430

If you have non-unique email then try to use this code. The filter method process all of items in array, and when the inner callback function (row=>row.email==textValue) return truthy then this row pushed into returned value but the others are not. This is filter by email address

var jsondata = json.data;
var textValue = document.getElementById("email").value;
var found = jsondata.filter(row=>row.email==textValue);
console.log(result); // an array of object

If email is unique, use find method. The find method callback same as previous one, but the difference, it exit when found first truthy value. The another difference is the returned value. This one returns an object, the searched object but not array of objects.

var jsondata = json.data;
var textValue = document.getElementById("email").value;
var found = jsondata.find(row=>row.email==textValue);
console.log(result); // an object

score 1 · Answer 2 · answered Jun 30 '19 at 19:57

1

Inside your for loop statement you should search jsondata.data[i] not jsondata[i]

answered Jun 30 '19 at 19:57

Dzoni

21
2

yeah this worked now I can see the email in json.data[i].email but I think another mistake that I'm doing is trying to get the the length from the local storage since is not looping at all and it stays in [0]. – Alejozitro Jun 30 '19 at 20:07
You can try storing localStorage.getItem(jsondata.data.length) in some variable. But i don't think it that problem, Maybe if you share more information about JSON object, 2-3 element, maybe I can help – Dzoni Jun 30 '19 at 20:23

score 0 · Answer 3 · answered Jun 30 '19 at 20:38

You don't show how you're storing or retrieving the data from local storage. To set it is something like (assuming the data is stored in an object called obj):

localStorage.setItem('data', JSON.stringify(obj));

Then to get it (retrieve data, use JSON.parse to turn back into an object called localData):

var localData = JSON.parse(localStorage.getItem('data'));

Now you can search through localData:

for(var i=0, iLen=localData.data.length; i<iLen; i++) {

  if(localData.data[i].email == textValue) {
    console.log(localData.data[i].email)
  }
}

Searching items on an array JSON

3 Answers3