searching and looping in an array using javascript or jQuery?

Question

Lets say I have an array that looks like this:

[{"id":23,"site_id":13, "name":"Test 1","date":"2019-01-26T11:02:18.5661283","category":"some cats"},
{"id":151,"site_id":15, "name":"Test 2","date":"2018-11-04T10:50:53.1756567","category":"some cats"}]

I need to search by site_id in this array and display the found ones:

so I did something like this which doesn't work:

var siteID = 13;

$.each(myArray.filter(
            function (el) { 
               return el.site_id !== siteID ;
            }), 
            function( index, value ) {

                var fo = '<p>'+el.name+'</p>';
                $('.forms').append(fo);

            });

Can someone please advice on this?

Does this answer your question? Find a value in an array of objects in Javascript — Gabriel
– Gabriel, Commented Oct 12, 2021 at 17:36
Please return and interact with the people who spent time helping you — mplungjan
– mplungjan, Commented Oct 13, 2021 at 4:58

Ravi Kumar Gupta · Accepted Answer · 2021-10-12 17:45:47Z

2

You can simply use the Array.filter() as below -

filteredArray = myArray.filter((a)=> {return a.site_id === siteID})

Here, we are calling .filter() on myArray and if the condition inside the function stays true, that element is returned otherwise it is dropped.

Outputs as -

Object { id: 23, site_id: 13, name: "Test 1", … }

since only this element's site_id matched the one provided.

answered Oct 12, 2021 at 17:45

Ravi Kumar Gupta

1,7882 gold badges24 silver badges41 bronze badges

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

2 Comments

mplungjan Over a year ago

OP had !== siteID

Ravi Kumar Gupta Over a year ago

True. Anyways, the purpose was to explain the way. Also, the question body mentions search by site_id so I would guess OP wanted to filter out the one matching. :)

mplungjan · Accepted Answer · 2021-10-12 17:54:51Z

2

Simpler to filter and then map. We want to update the DOM in one go

const arr = [{"id":23,"site_id":13, "name":"Test 1","date":"2019-01-26T11:02:18.5661283","category":"some cats"},
{"id":151,"site_id":15, "name":"Test 2","date":"2018-11-04T10:50:53.1756567","category":"some cats"}]

const mySiteId = 13;
$('.forms').append(
  arr
  .filter(({site_id}) => site_id !== mySiteId)
  .map(({name}) => `<p>${name}</p>`).join("")
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="forms"></div>

answered Oct 12, 2021 at 17:54

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Comments

mplungjan · Accepted Answer · 2021-10-13 09:25:42Z

2

You can simply loop through the data to perform this task.

Consider the following code:-

You can add break statement if you're sure that the site_id is unique in object in the data.

let siteId = 13;
let dataRows = [
    {"id":23,"site_id":13, "name":"Test 1","date":"2019-01-26T11:02:18.5661283","category":"some cats"},
    {"id":151,"site_id":15, "name":"Test 2","date":"2018-11-04T10:50:53.1756567","category":"some cats"}  
];

let formElements = '';

for(let data of dataRows){
  if(data.site_id == siteId){
    formElements += '<p>'+data.name+'</p>';
  }
}
$('.forms').append(formElements);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="forms"></div>

edited Oct 13, 2021 at 9:25

mplungjan

180k29 gold badges183 silver badges246 bronze badges

answered Oct 12, 2021 at 17:42

Utkarsh

1154 bronze badges

Comments

Eymen · Accepted Answer · 2021-10-12 17:56:56Z

1

you need to do for loop/map
like this :

the array:

var arr = [
    {"id":23,"site_id":13, "name":"Test 1","date":"2019-01-26T11:02:18.5661283","category":"some cats"},
    {"id":151,"site_id":15, "name":"Test 2","date":"2018-11-04T10:50:53.1756567","category":"some cats"}  
];

for loop:

for (let e of arr){
  if(e.site_id == 15){
    //do something
  }
}

you can also do a switch-case for it

for (let e of arr){
  switch(e.site_id){
    case 15 {
      //do something if the id is 15 
    }
    case 13{
      //do something if the id is 13 
    }
    case 99 {
      //do something if the id is 99
    }
  }
}

answered Oct 12, 2021 at 17:56

Eymen

1751 silver badge11 bronze badges

Comments

kirtivardhan mishra · Accepted Answer · 2021-10-12 18:45:56Z

1

Just simply loop through the given list and then match using Ngif The following is an example of using JavaScript to loop through an array.

let myArray = ["one", "two", "three", "four"];

     for(let i = 0; i < myArray.length; i++){ 
     console.log(myArray[i]);
}

answered Oct 12, 2021 at 18:45

kirtivardhan mishra

193 bronze badges

Collectives™ on Stack Overflow

searching and looping in an array using javascript or jQuery?

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related