JS Loop through AJAX-response array filled with arrays, how to get the data?

Question

I'm doing an ajax-call, which returns an array. This returned array consists of arrays, in each of which is another array :

I'm trying to do a for-loop in javascript, to create an element for each of these arrays in the response-array. My code:

        $.ajax({
        url: $("base").attr('href') + 'json/handler',
        data : data,
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        success: function(data){
            console.log(data);
            for(var entry in data) {

            $('#testdiv').prepend("<span class='test' data-unixtime='" + entry[2] + "'>" + entry[0] + "</span><br>");

            }

entry[0] and entry[2] just return a single (random) number. I also cant seem to reach the data in the nested-array by using entry[1][tablename].

I tried multiple ways of doing the loop and got a few different (random?) numbers out of it, but nothing has come even close to the values I need.

Try logging what entry is, it's not what you think it is. Also don't use for in on arrays. — charlietfl
– charlietfl, Commented Jan 14, 2017 at 16:15
I'm used to Twig (PHP), so I made this mistake! This way seems to work: var arrayLength = data.length; for (var i = 0; i < arrayLength; i++) { alert(data[i]); thanks! — peter vries
– peter vries, Commented Jan 14, 2017 at 16:21
Have you tried to add dataType as attribute of ajax function? dataType:'json' the remember to add "" between the key that you want to access "tablename" — Marco Moretti
– Marco Moretti, Commented Jan 14, 2017 at 16:23

Joe Brailsford · Accepted Answer · 2017-01-14 16:25:13Z

1

You can use a for loop, but you'd be better with foreach which is cleaner to use. As for the nested object (note: object, not array) you'd access that by calling it's property, not trying to access an index. Here's a js bin that should help you along! ;) You should just be able to drop the data.forEach section into your ajax response function (success: function(data){})

https://jsbin.com/dorayeriku/1/edit?html,js,output

   var data = [
  ['10:00', {tablename: 'table1', tableseats: 2}, '1234567'],
  ['11:00', {tablename: 'table2', tableseats: 2}, '1234568'],
  ['12:00', {tablename: 'table3', tableseats: 2}, '1234569'],
          ]


    data.forEach((entry) => {
      $('#testdiv').prepend("<span class='test' data-unixtime='" + entry[2] + "'>time: " + entry[0] + "<br/> tablename: " + entry[1].tablename +"<br/>table seats:" + entry[1].tableseats + "<br/><br/></span><br>");
    })

Any questions or other help you need, just fire them at me :)

answered Jan 14, 2017 at 16:25

Joe Brailsford

1998 bronze badges

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

1 Comment

Joe Brailsford Over a year ago

For record, here's all three ways, including yours that wasn't working, you should be able to work out why, but if you want more detail I'm happy to oblige. jsbin.com/nimuluqoho/edit?js,output

Collectives™ on Stack Overflow

JS Loop through AJAX-response array filled with arrays, how to get the data?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related