loop through a json object

Question

I have a json object: slider_data which has value like this:

[{
  "id": "1",
  "image": "http:\/\/localdrone2.com\/wp-content\/uploads\/2018\/02\/slider-1-1.jpg",
  "title": "aaa",
  "more_info": "aaaaa",
  "button_link": "aaaaa"
}, 
{
  "id": "2",
  "image": "http:\/\/localdrone2.com\/wp-content\/uploads\/2018\/02\/slider-3-6.jpg",
  "title": "bbbb",
  "more_info": "bbbbb",
  "button_link": "bbbbb"
}]

I just want to loop through this data as follows:

 $.each(slider_data, function(index, element) {
        console.log(element); 
 });

This is pretty simple and should work. But I am getting the following error:

Uncaught TypeError: Cannot use 'in' operator to search for 'length' in [{"id":"1","image":"http://localdrone2.com/wp-content/uploads/2018/02/slider-1-1.jpg","title":"aaa","more_info":"aaaaa","button_link":"aaaaa"},{"id":"2","image":"http://localdrone2.com/wp-content/uploads/2018/02/slider-3-6.jpg","title":"bbbb","more_info":"bbbbb","button_link":"bbbbb"}]

What am I doing wrong?

JSON != JavaScript Object/Array. Do you have a string of JSON formatted data or a JavaScript Array? — phuzi, Feb 14 '18 at 11:16
It looks good for me.. So parsing might solve the problem. `var data = JSON.parse(slider_data)` should do the job and then loop through `data`.. — Guruprasad J Rao, Feb 14 '18 at 11:18

score 2 · Answer 1 · answered Feb 14 '18 at 11:17

2

The in operator only works on objects. You are using it on a string. Make sure your value is an object before you using $.each. In this specific case, you have to parse the JSON:

$.each(JSON.parse(myData), ...);

answered Feb 14 '18 at 11:17

Sugan Krishna

413
4
11

score 0 · Answer 2 · answered Feb 14 '18 at 11:23

Yes. Parsing before loop through solved the problem:

var json_data = absbBtToS.slider_data;
    var slider_data = JSON.parse(json_data);

        console.log(slider_data); 
    $.each(slider_data, function(index, element) {

        console.log(element); 
    });

loop through a json object

2 Answers2

Linked