How to filter a multidimensional object array

Question

I want to filter an object array taking into account multiple attribute values. The attributes are selected using checkboxes, I want to filter the array using those values (for example, Ram, Primary camera).

I want to filter like an E-commerce website:

var myObject = [
    {
        "ProId": 12,
        "ProName": "Samsung Galaxy A9",
        "AttriValue": {
            "Front Camera": "16 MP and Above",
            "Internal Memory": "128 GB and Above",
            "Network Type": "4G",
            "Primary Camera": "16 MP and Above",
            "Ram": "6 GB"
        }
    },
    {
        "ProId": 11,
        "ProName": "Vivo Y95",
        "AttriValue": {
            "Front Camera": "16 MP and Above",
            "Internal Memory": "64 GB",
            "Network Type": "4G",
            "Primary Camera": "13 - 15.9 MP",
            "Ram": "4 GB"
        }
    },
    {
        "ProId": 10,
        "ProName": "OPPO A7",
        "AttriValue": {
            "Front Camera": "16 MP and Above",
            "Internal Me...
        ....
     }
 ]

Your question is unclear. `I have a multiple check box with attribute name`. Please add your `html` code too. — random, Jun 17 '19 at 11:33
Possible duplicate of [How to filter object array based on attributes?](https://stackoverflow.com/questions/2722159/how-to-filter-object-array-based-on-attributes) — ElChiniNet, Jun 17 '19 at 11:40
in the image when i multiple checked in internal memory(Attribute Name) then filter product according to checked value (Attribute Value like 64 gb 32 gb) and when i multiple checked in ram(Attribute Name) then filter product according to checked value like 4 gb 8 gb — Saurabh Verma, Jun 18 '19 at 04:52

score 1 · Answer 1 · answered Jun 17 '19 at 11:52

1

1. Use Javascript filter method

filtered = myObject.filter(i => i.AttriValue.Ram === "4 Gb")

this way you can filter all products with 4GB ram

2. Iterate over myObject with for or while loop

filtered = []
for(let obj of myObject) {
  if(obj.AttriValue.RAM === '4 GB') filtered.push(obj)
}

answered Jun 17 '19 at 11:52

Gor

2,808
6
25
46

i have add image link. in this image i have a multiple check box i need unlimited filter for every attribute name with arrtibute value – Saurabh Verma Jun 17 '19 at 11:58

score 0 · Answer 2 · edited Jun 20 '20 at 09:12

You can use filter for that:

const myObject = [{
    "ProId": 12,
    "ProName": "Samsung Galaxy A9",
    "AttriValue": {
      "Front Camera": "16 MP and Above",
      "Internal Memory": "128 GB and Above",
      "Network Type": "4G",
      "Primary Camera": "16 MP and Above",
      "Ram": "6 GB"
    }
  },
  {
    "ProId": 11,
    "ProName": "Vivo Y95",
    "AttriValue": {
      "Front Camera": "16 MP and Above",
      "Internal Memory": "64 GB",
      "Network Type": "4G",
      "Primary Camera": "13 - 15.9 MP",
      "Ram": "4 GB"
    }
  },
]

const attrToFilter = {
  "Primary Camera": "13 - 15.9 MP",
  "Ram": "4 GB"
};

const filterFunction = (data, attrToFilter) =>
  data.filter(e =>
    Object.keys(attrToFilter)
    .map(i =>
      e.AttriValue[i] === attrToFilter[i]
    )
    .every(attr => !!attr)
  )

console.log(filterFunction(myObject, attrToFilter))

EDIT

I've updated my code for filtering with dynamic attributes.

You can set the attributes to be filtered with in: attrToFilter

How to filter a multidimensional object array

2 Answers2