Filtering JSON array using jQuery grep()

Question

I've searched many examples on this site but can't seem to fit them into my needs. I just need to filter some JSON results using grep().

Below is my JSON:

var data = { "items": [
    {
        "id":       1,
        "category": "cat1"
    },
    {        
        "id":       2,
        "category": "cat2"
    },
    {
        "id":       3,
        "category": "cat1"
    }
]}

With the example above

how would I return all items with the category of cat1 ?
how would I return all items with the category of cat1 and id of 3 ?

I know this isn't a great example but any help would be awesome! Thanks!

I have tried variations of the following

data.items = $.grep(data.items, function(element, index) {
    return element.id == 1;
    console.log(data.items);
});

Loop through all items, save them to a new variable and return that variable? — Mandy Schoep
– Mandy Schoep, Commented Jan 16, 2014 at 20:43
yes I have read the documentation, I have tried a lot of different combinations of the example, I added the example to my post. — RiddleMeThis
– RiddleMeThis, Commented Jan 16, 2014 at 23:37
Apart from the misplaced console.log(), I fail to see the issue in your example. — WynandB
– WynandB, Commented Jan 17, 2014 at 4:54

Dylan Valade · Accepted Answer · 2016-03-25 17:15:18Z

59

var data = {
    "items": [{
        "id": 1,
        "category": "cat1"
    }, {
        "id": 2,
        "category": "cat2"
    }, {
        "id": 3,
        "category": "cat1"
    }]
};

var returnedData = $.grep(data.items, function (element, index) {
    return element.id == 1;
});


alert(returnedData[0].id + "  " + returnedData[0].category);

The returnedData is returning an array of objects, so you can access it by array index.

http://jsfiddle.net/wyfr8/913/

edited Mar 25, 2016 at 17:15

Dylan Valade

5,6056 gold badges44 silver badges57 bronze badges

answered Mar 31, 2014 at 6:55

Marko

11.1k17 gold badges73 silver badges94 bronze badges

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

1 Comment

RiddleMeThis Over a year ago

I had the console.log in the wrong spot so I wasn't seeing it.

Paaarth · Accepted Answer · 2019-08-29 04:40:39Z

var data = {
  "items": [{
    "id": 1,
    "category": "cat1"
  }, {
    "id": 2,
    "category": "cat2"
  }, {
    "id": 3,
    "category": "cat1"
  }, {
    "id": 4,
    "category": "cat2"
  }, {
    "id": 5,
    "category": "cat1"
  }]
};
//Filters an array of numbers to include only numbers bigger then zero.
//Exact Data you want...
var returnedData = $.grep(data.items, function(element) {
  return element.category === "cat1" && element.id === 3;
}, false);
console.log(returnedData);
$('#id').text('Id is:-' + returnedData[0].id)
$('#category').text('Category is:-' + returnedData[0].category)
//Filter an array of numbers to include numbers that are not bigger than zero.
//Exact Data you don't want...
var returnedOppositeData = $.grep(data.items, function(element) {
  return element.category === "cat1";
}, true);
console.log(returnedOppositeData);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p id='id'></p>
<p id='category'></p>

The $.grep() method eliminates items from an array as necessary so that only remaining items carry a given search. The test is a function that is passed an array item and the index of the item within the array. Only if the test returns true will the item be in the result array.

Collectives™ on Stack Overflow

Filtering JSON array using jQuery grep()

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related