CODEWITHSUNDEEP
javascriptjsonajax
user3918443
user3918443

Reputation: 131

$.each function is not iterating

I am working with a relatively complex JSON structure and am unable to iterate through it via the $.each() function. I'm pretty sure it's something to do with the weird 2-dimensional array I am passing through in the value section of the normal array (hope that made sense). I am new to Ajax and JSON so just need some guidance on the best way to handle JSON when it is returned via an AJAX Call. Thanks! 

$.ajax({
        type: 'POST',
        url: 'model.php',
        data: formData,
        dataType: 'json',
         encode : true 
        }).done(function(data){
        
                        var i = 0;
                      
                        for(var k in data){ 
                            window.alert(k);  
                        }   //this works         
            
                      $.each(data, function(key, value){ //however this does not display anything
                         
                          window.alert("should be outputted");
                          window.alert("key" + key + "value" + value[i]['email']);
                          i++;
                          
                      });
                  });

JSON I am using:

{"bodge.com":[{"email":"[email protected]","orders":"2","value":"19.67"},{"email":"[email protected]","orders":"5","value":"21.89"},{"email":"[email protected]","orders":"3","value":"13.71"},{"email":"[email protected]","orders":"7","value":"6.49"},{"email":"[email protected]","orders":"3","value":"24.36"},{"email":"[email protected]","orders":"3","value":"11.26"},{"email":"[email protected]","orders":"3","value":"5.36"},{"email":"[email protected]","orders":"6","value":"18.21"},{"email":"[email protected]","orders":"1","value":"10.24"},{"email":"[email protected]","orders":"2","value":"6.59"},{"email":"[email protected]","orders":"10","value":"7.85"},{"email":"[email protected]","orders":"1","value":"15.51"},{"email":"[email protected]","orders":"2","value":"7.92"},{"email":"[email protected]","orders":"3","value":"13.22"},{"email":"[email protected]","orders":"4","value":"23.14"},{"email":"[email protected]","orders":"7","value":"15.17"},{"email":"[email protected]","orders":"4","value":"17.62"},{"email":"[email protected]","orders":"4","value":"22.03"},{"email":"[email protected]","orders":"10","value":"16.71"},{"email":"[email protected]","orders":"4","value":"6.09"},{"email":"[email protected]","orders":"1","value":"23.88"},{"email":"[email protected]","orders":"8","value":"5.37"}],"bodge.com ":[{"email":"[email protected] ","orders":" 9 ","value":" 21.22"}]}

Upvotes: 0

Views: 57

Answers (3)

Zev Spitz
Zev Spitz

Reputation: 15317

Your JSON has (at least) two levels:

  1. an object with keys ("bodge.com", "bodge.com "), and

  2. each key holds an array of objects

    {
    "bodge.com": [
        {"email":"[email protected]","orders":"2","value":"19.67"},
        {"email":"[email protected]","orders":"5","value":"21.89"},
        ...
        {"email":"[email protected]","orders":"1","value":"23.88"},
        {"email":"[email protected]","orders":"8","value":"5.37"}
    ],
    "bodge.com ": [
        {"email":"[email protected] ","orders":" 9 ","value":" 21.22"}
    ]
}

In order to iterate through the structure, you will need at least two levels of iteration:

$.each(data, function(domain, objects) {
    console.log(domain); // will output "bodge.com" or "bodge.com "
    $.each(objects, function(index, x) {
        console.log(x.email);
        console.log(x.orders);
        console.log(x.value);
        console.log(index); // will output the 0-based position of x within the array
    });
});

Note that you are using $.each for two different kinds of iteration: first over the keys and values of an object, then over the items in an array.

As an alternative, use Object.keys to get an array of an object's keys, and the forEach method:

Object.keys(data).forEach(function(domain) {
    console.log(domain); // will output "bodge.com" or "bodge.com "
    data[domain].forEach(function(x, index) {
        console.log(x.email);
        console.log(x.orders);
        console.log(x.value);
        console.log(index); // will output the 0-based position of x within the array
    });
});

Upvotes: 1

Phd. Burak Öztürk
Phd. Burak Öztürk

Reputation: 1767

You could try this;

$.ajax({
    type: 'POST',
    url: 'model.php',
    data: formData,
    dataType: 'json',
     encode : true 
    }).done(function(data){

var list = JSON.parse(data);     

                  $.each(list, function(i){
                     alert(list[i].your_filed);
                  });            
});

Upvotes: 0

Jordan Cauley
Jordan Cauley

Reputation: 353

It looks like you should be bypassing data['bodge.com'] into the each function rather that simply data.

Upvotes: 0

Related Questions