How can I search JSON with jQuery?

Question

I'm using a session storage to temporarily hold data and try to search for a string (CatalogNumber) in the session data. If the string isn't existing I'd like to add it.

This is what I've tried so far but it's still allowing duplicates. And the search isn't working for the array for some reason:

var gridData = {
    catalogNumber: dataItem.CatalogNumber,
    fullName: dataItem.FullName,
    position: dataItem.CurrentTitle
};

sessionStorageData = JSON.parse(sessionStorage.getItem('people'));

if (jQuery.inArray(gridData.catalogNumber, sessionStorageData ) === -1) {
    sessionStorageData.push(gridData);
    sessionStorage.setItem('people', JSON.stringify(sessionStorageData));
}

Data

[{"catalogNumber":"51263bf7-83c4-e411-825d-28b2bd14ba94","fullName":"John Doe","position":"Receptionist"}]

possible duplicate of [How to search JSON tree with jQuery](http://stackoverflow.com/questions/5288833/how-to-search-json-tree-with-jquery) — Stephan Weinhold, May 05 '15 at 05:25
You may be interested in my JSON.search API which is 5x faster than $.grep and allows you to search using regex. See http://json.spiritway.co/ — mikewhit, May 08 '15 at 20:45

Martin Konecny · Accepted Answer · 2015-05-05T05:59:26.480

1

It makes sense that the array search isn't working.

Your array is an array of objects. You are trying to match a string (in this case gridData.catalogNumber) against those objects.

Solution #1:

If your array was an array of strings, then your search would work. An alternate approach might be:

function found(gridData, sessionStorageData) {
  for (o in sessionStorageData) {
    if (sessionStorageData[o].catalogNumber == gridData.catalogNumber) {
      return true;
    }
  }
  return false;
}

if (!found(gridData.catalogNumber, sessionStorageData )) {
    sessionStorageData.push(gridData);
    sessionStorage.setItem('people', JSON.stringify(sessionStorageData));
}

Solution #2

An even better solution might be to map your array of objects into an array of strings.

var catalogNumbers = sessionStorageData.filter(function(obj){ return !!obj }).map(function(obj) { return obj.catalogNumber; } );
if (jQuery.inArray(gridData.catalogNumber, catalogNumbers ) === -1) {
    sessionStorageData.push(gridData);
    sessionStorage.setItem('people', JSON.stringify(sessionStorageData));
}

edited May 05 '15 at 05:59

answered May 05 '15 at 05:28

Martin Konecny

57,827
19
139
159

1

What is `def`? Do you mean `function`? – redbmk May 05 '15 at 05:30
1

Javascript `for-in` is not like PHP `foreach`. `o` is the key, not the element. – Barmar May 05 '15 at 05:34
@Barmar - was in Python mode there for a bit. Thx. – Martin Konecny May 05 '15 at 05:34
thank you so much - solution 2 is working great for the most part. I do have a small hiccup tho. When I clear cache & session data the sessionStorageData key 'people' has a value of '[null]' which is causing the following error: Cannot read property 'catalogNumber' of null – chris May 05 '15 at 05:55
ok updated answer. Added a `filter` to remove all "null/undefined" array elements. – Martin Konecny May 05 '15 at 06:00
@MartinKonecny I'm still getting the same error for the same line. I triple checked and I have identical code to what you have.. not sure what the issue is. – chris May 05 '15 at 06:12
nevermind - just a dumb case sensitivity issue on my side... this works great! Thank you!! – chris May 05 '15 at 14:38
@Barmar, there is the proposed `for-of` which would work that way... I don't think it's well supported yet though. – redbmk May 05 '15 at 17:30

How can I search JSON with jQuery?

1 Answers1

Solution #1:

Solution #2