Cómo tener un foreach dentro de un foreach en jQuery?

Question

Hola chicos! En primer lugar, sé que este tipo de cosas es bastante mierda, pero esa es la forma en que visualizo lograr mi objetivo.

Este es el trato: Tengo un objeto JSON que contiene una matriz, pero, por desgracia, tengo que iterar a través de la lista de un objeto JSON, y luego iterar A TRAVÉS esa matriz que mencioned antes. El objeto JSON mirada de la siguiente manera (está en portugués, pero ustedes pueden entenderlo):

{ "produtos": [{ "clave": "DERIVADOS DE FERRO", "valor": 217816909}, { "clave": "MADEIRAS, SUAS MANUFATURAS E MOBILIÁRIO MÉDICO Cirurgico " "Valor": 117812290}, { "clave":" CELULOSE, Papel e SUAS OBRAS " "Valor": 100086937}, { "clave":" Carne Suina " "Valor": 81738783}, { "clave":" Carne BOVINA " "Valor": 74894768}, { "clave":" Carne de AVES", "valor": 65292433}, { "clave": "Outros", "Valor": 444 520 811}], "ano": 2005, "tipo": 1}

Produtos es la matriz he mencionado, y tengo otros dos valores que son importantes: ano (año) y tipo (tipo). Mi mirada código como sigue:

jQuery.getJSON("/webportos/Porto/GraficoComercio?id=" + iddoporto.className + "&ano=2005", null, function (items) {                
    jQuery.each(items, function (itemNo, item) {
        jQuery.each(item.produtos, function (dicNo, dic) {
            options.series.push({ name: dic.Key, data: dic.Value});                             
            options.title.text = "Comércio - "+item.ano;
            options.yAxis.title.text = "Exportação";                                
            options.tooltip.formatter = function () {
                return '<b><u>' + this.series.name + '</u></b><br/><b>' + this.x + '</b>: ' + this.y + ' ';
            }           
        });
    });

    chart = new Highcharts.Chart(options);              
});

Esta pieza de código hace que la consola Chrome JavaScript para visualizar:

ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js:32 Uncaught TypeError: Cannot read property 'length' of undefined

Pueden ustedes ayudarme?

Answer 1

Es esto porque usted está tratando de utilizar each () en una matriz no?

jQuery.each(items, function (itemNo, item) {

A mi entender, jQuery.each (objeto, devolución de llamada, args) es sólo para uso en matrices. Lo primero que hace es hacer una llamada a object.length. A menos que tenga

[ { "produtos": [{ "clave": "DERIVADOS DE FERRO", "valor": 217816909}, { "clave": "MADEIRAS, SUAS MANUFATURAS E MOBILIÁRIO MÉDICO Cirurgico " "Valor": 117812290}, { "clave":" CELULOSE, PAPEL E SUAS OBRAS " "Valor": 100086937}, { "clave": "Carne Suina", "Valor": 81738783}, { "clave":" Carne BOVINA", "Valor": 74894768}, { "clave": "Carne de Aves", "Valor": 65292433}, { "Clave": "Outros", "Valor": 444520811}], "ano": 2005, "tipo": 1} ]

vas a conseguir ese error.

Además, puede tomar la sugerencia de Diodeus en consideración. jQuery.each es un poco menos eficiente que simplemente usar una para colocar a través de sus datos.

Answer 2

No es necesario jQuery para iterar a través de los datos JSON. Utilizar el viejo y simple Javascript.

Ver esta pregunta: JSON / jerarquía YAML como un árbol en HTML?

function renderJSON(obj) {
    var keys = []
    var retValue = ""
    for (var key in obj) {
            if(typeof obj[key] == 'object') {
                    retValue += "<div class='tree'>" + key                                          
                    retValue += renderJSON(obj[key])
                    retValue += "</div>"
            }
            else {
                    retValue += "<div class='tree'>" + key + " = " + obj[key] + "</div>"
            }

       keys.push(key)
    }
    return retValue
    }