Nueva pregunta

Pregunta:

Fecha: 16-01-2018 09:16:56 (En Español)

mostrar arrays con javascript que llevan subarrays[Resuelta]

hola a todos, estoy tratando de leer el valor de una lista de JSON, pero no logro sacar los valores en un bucle determinado, mi ejemplo(problema) actual es:
<script type="text/javascript"> 
	var data='{"1":{"per_nr":"1","nombre":"Jose","ventas":[{"tag":"1","producto":"naranja","cantidad":"5","precio":"3","saldo":15,"saldo_cum":15},{"tag":"1","producto":"naranja","cantidad":"5","precio":"5","saldo":25,"saldo_cum":40},{"tag":"1","producto":"naranja","cantidad":"10","precio":"3","saldo":30,"saldo_cum":70},{"tag":"1","producto":"naranja","cantidad":"15","precio":"2","saldo":30,"saldo_cum":100},{"tag":"1","producto":"naranja","cantidad":"12","precio":"2","saldo":24,"saldo_cum":124}]},"2":{"per_nr":"2","nombre":"Maria","ventas":[{"tag":"1","producto":"naranja","cantidad":"11","precio":"2","saldo":22,"saldo_cum":22}]},"3":{"per_nr":"3","nombre":"Teresa","ventas":[{"tag":"1","producto":"naranja","cantidad":"8","precio":"4","saldo":32,"saldo_cum":32}]}}';
	data = JSON.parse(data);	
/* esto funciona */
	console.log(data[1].per_nr);
	console.log(data[1].nombre);
	console.log(data[1].ventas[1].tag);
	console.log(data[1].ventas[1].producto);
	console.log(data[2].per_nr);	
/* esto no funciona : que hago mal en este recorrido ?*/	
		for (var i = 0; i < data.length; i++) {
			console.log(data.length);
				console.log(data[i].nombre + ' is a ' + data[i].per_nr + '.');
			}
Les estaría muy agradecida por la ayuda para el presente problema...
Etiquetas: JQuery - JSON Votos: 1 - Respuestas: 7 - Vistas: 10 Compartir en: Google Facebook Twitter LinkedIn Link
 

Respuestas:

  • Fecha: 16-01-2018 09:31:44 tu problema radica que debes hacer un bucle dentro del bucle... (anidados)
    Esto el primer bucle es = a recorrer los primeros arreglos, y el segundo = recorrer las ventas...

    Saludos...
    Stryfe™
      Votos: 0 - Link respuesta
     
  • Fecha: 16-01-2018 09:37:08 Hola Maria,
    En este caso el string 'data' es un objeto con propiedades llamadas '1', '2' y '3'. Cada una de esas propiedades a su vez es un objeto con más propiedades.

    Es por esa razón que la primera parte sí funciona. Tomemos una línea de ejemplo:

    console.log(data[1].per_nr);


    Esto manda a la consola el valor de la propiedad 'per_nr' del objeto almacenado en la propiedad '1' del objeto 'data'. No hay ningún arreglo ahí.

    En tu JSON se puede ver claramente porque las llaves ('{' y '}') denotan un objeto mientras que los corchetes ('[' y ']') denotan un arreglo.

    Si quieres iterar sobre los elementos de un arreglo utiliza:

    for (propiedad in objeto)
    


    y entonces te quedaría algo así:

    var data='{"1":{"per_nr":"1","nombre":"Jose","ventas":[{"tag":"1","producto":"naranja","cantidad":"5","precio":"3","saldo":15,"saldo_cum":15},{"tag":"1","producto":"naranja","cantidad":"5","precio":"5","saldo":25,"saldo_cum":40},{"tag":"1","producto":"naranja","cantidad":"10","precio":"3","saldo":30,"saldo_cum":70},{"tag":"1","producto":"naranja","cantidad":"15","precio":"2","saldo":30,"saldo_cum":100},{"tag":"1","producto":"naranja","cantidad":"12","precio":"2","saldo":24,"saldo_cum":124}]},"2":{"per_nr":"2","nombre":"Maria","ventas":[{"tag":"1","producto":"naranja","cantidad":"11","precio":"2","saldo":22,"saldo_cum":22}]},"3":{"per_nr":"3","nombre":"Teresa","ventas":[{"tag":"1","producto":"naranja","cantidad":"8","precio":"4","saldo":32,"saldo_cum":32}]}}';
    
    data = JSON.parse(data);    
    /* esto funciona */
    console.log(data[1].per_nr);
    console.log(data[1].nombre);
    console.log(data[1].ventas[1].tag);
    console.log(data[1].ventas[1].producto);
    console.log(data[2].per_nr);   
    console.log(data.length);     
    /* esto también */    
    for (let property in data) {
        console.log(data[property].nombre + ' is a ' + data[property].per_nr + '.');
    }
    
      Votos: 2 - Link respuesta
     
  • Fecha: 16-01-2018 17:27:12 Todavía no logro resolver de esa manera...gracias por la ayuda , enmtretanto estoy tratando de hacerlo dentro de una tabla...   Votos: 0 - Link respuesta
     
  • Fecha: 17-01-2018 13:22:17 Prueba así:

    <ul id="vendedores">
    </ul>
    


    var data='{"1":{"per_nr":"1","nombre":"Jose","ventas":[{"tag":"1","producto":"naranja","cantidad":"5","precio":"3","saldo":15,"saldo_cum":15},{"tag":"1","producto":"naranja","cantidad":"5","precio":"5","saldo":25,"saldo_cum":40},{"tag":"1","producto":"naranja","cantidad":"10","precio":"3","saldo":30,"saldo_cum":70},{"tag":"1","producto":"naranja","cantidad":"15","precio":"2","saldo":30,"saldo_cum":100},{"tag":"1","producto":"naranja","cantidad":"12","precio":"2","saldo":24,"saldo_cum":124}]},"2":{"per_nr":"2","nombre":"Maria","ventas":[{"tag":"1","producto":"naranja","cantidad":"11","precio":"2","saldo":22,"saldo_cum":22}]},"3":{"per_nr":"3","nombre":"Teresa","ventas":[{"tag":"1","producto":"naranja","cantidad":"8","precio":"4","saldo":32,"saldo_cum":32}]}}';
    var D = JSON.parse(data);    
    console.log(D);
    for (let property in D) {
        //console.log(D[property].nombre + ' is a ' + D[property].per_nr + '.');
        var valor = '<li>Nombre: '+D[property].nombre;
        		valor += '<ul><li>Ventas: '+D[property].ventas.length+'</li>'
            if(D[property].ventas.length >=1){
            valor += '<li>Lista:'
        						if(D[property].ventas.length>=1){
        								valor += '<ul>';
                        for(var j=0; j<D[property].ventas.length;j++){
                        	valor += '<li>'+D[property].ventas[j].producto+'</li>'
                        }
                        	valor += '</ul></li></ul>'
                      }else{
    										valor += '</li></ul>'
                      }
            }else{
            	valor += '</ul></li>'
            }
        $("#vendedores").append(valor);
        
    }
    



    MUESTRA
      Votos: 1 - Link respuesta
     
  • Fecha: 17-01-2018 22:01:48 Hola Carlos Quintero, muchas gracias, la respuesta es realmente completa y útil. Me estuve mirando la forma de tratar esos listados anidados y por eso ahora entiendo más del cómo realizarlo y en que medida me has aliviado el proceso de aprendizaje. Muchísimas gracias.   Votos: 2 - Link respuesta
     
  • Fecha: 19-01-2018 19:10:37 Aquí está tu tabla María.
    Cuando el array usa índice del cliente debes iterar con for ... in, es decir con la forma for ( var indice in objeto ){}, aunque no es la única manera de obtener los datos.
    let d= '{"1":{"per_nr":"1","nombre":"Jose","ventas":[{"tag":"1","producto":"naranja","cantidad":"5","precio":"3","saldo":15,"saldo_cum":15},{"tag":"1","producto":"naranja","cantidad":"5","precio":"5","saldo":25,"saldo_cum":40},{"tag":"1","producto":"naranja","cantidad":"10","precio":"3","saldo":30,"saldo_cum":70},{"tag":"1","producto":"naranja","cantidad":"15","precio":"2","saldo":30,"saldo_cum":100},{"tag":"1","producto":"naranja","cantidad":"12","precio":"2","saldo":24,"saldo_cum":124}]},"2":{"per_nr":"2","nombre":"Maria","ventas":[{"tag":"1","producto":"naranja","cantidad":"11","precio":"2","saldo":22,"saldo_cum":22}]},"3":{"per_nr":"3","nombre":"Teresa","ventas":[{"tag":"1","producto":"naranja","cantidad":"8","precio":"4","saldo":32,"saldo_cum":32}]}}',
    j= JSON.parse(d), item= 0;
    // no sé el índice de cliente: 
    // uso  for ... in
    for( var x in j){
       
       let  id = j[x].per_nr,
            nom = j[x].nombre,
            vta = j[x].ventas; //<-este es array
    				
           //... código parte 1 si deseas
     
        for(y=0; y<vta.length; y++){
            let tag = vta[y].tag,
                pro = vta[y].producto,
                can = vta[y].cantidad,
                pre = vta[y].precio,
                sal = vta[y].saldo;
                // aquí hacemos que coloque total sólo en último
                if( y < (vta.length-1) ) {
                    acu = ' --';
                }else{
                    acu = vta[y].saldo_cum;
                }
                
            item++;
            //... código parte 2
           console.log(" | "+item+" | "+id+" | "+nom+" | "+tag+" | "+pro+" | "+can+" | "+pre+" | "+sal+" | "+acu+" | ");
        }
    
    }
    

    Vista del Json para determinar qué usar

    Si logras entender la navegación por este json, ya sabrás más que muchos y te aseguro que tienes una herramienta que te sirve para muuuchos casos reales.
    Te dejo este otro json para que lo navegues, es muy común encontrarlo. Es un menú. Míralo con el visor.
    [{
            "id": "file",
            "value": "File",
                "menuitem": [
                    {
                        "value": "New", "onclick": "CreateNewDoc()"
                    },{
                        "value": "Open", "onclick": "OpenDoc()"
                    },{
                        "value": "Close", "onclick": "CloseDoc()"
                    }
                ]
        },
        {
            "id": "edit",
            "value": "Edit",
                "menuitem": [
                    {
                        "value": "Copy", "onclick": "CopyDesdePapelera()"
                    },{
                        "value": "Paste", "onclick": "Paste()"
                    },{
                        "value": "Algo", "onclick": "Algo()"
                    }
                ]
        }
    ]
    

    Saludos María un abrazo a la distancia.
      Votos: 1 - Link respuesta
     
  • Fecha: 20-01-2018 00:13:45 Hola Néstor, muchas gracias, el trabajo de explicación es único y de resultado perfecto, es lo que quería entender. Me imagino eres un pedagogo en el campo de la informática. Por ahora, una vez más recibí una ayuda impagable y de aplicación inmediata. Que tengas un fin de semana maravilloso.
    Un abrazo agradecido desde Alemania
      Votos: 0 - Link respuesta
     
Para participar activamente de la comunidad primero debes autenticarte, ingresa al sistema.Iniciar Sesión
 
frjcbbae garagebible.com