Stampare una tabella dinamica con dati json

PazzoFrontEnd

Utente Attivo
8 Ott 2013
46
0
6
Buongiorno a tutti, sono nuovo nel forum e spero di trovare qui la soluzione ad un problema particolare che sto affrontando. Non va la porto per le lunghe. Ho il seguente json:

Codice:
{
    "json": {
        "competitions": [
            {
                "competitionId": 10,
                "name": "CampionatoX",
                "matches": [
                    {
                        "matchId": "numer_string",
                        "orderedParticipants": [
                            {
                                "name": "SQUADRA_CASA",
                            },
                            {
                                "name": "SQUADRA_TRASFERTA",
                            }
                        ]
                    }                 
                 
                ],
                "events": [{
                        "matchId": "numer_string",
                        "suppliers": [
                            {
                                "supplierId": 1,
                                "bets": [
                                    {
                                        "bets": [
                                            {
                                                "oddsDecimalFormatted": "2,15"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,30"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,40"
                                            }
                                        ]
                                    }
                                ]
                            },
                            {
                                "supplierId": 3,
                                "bets": [
                                    {
                                        "bets": [
                                            {
                                                "oddsDecimalFormatted": "2,15"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,30"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,30"
                                            }
                                        ]
                                    }
                                ]
                            },
                            {
                                "supplierId": 4,
                                "bets": [
                                    {
                                        "bets": [
                                            {
                                                "oddsDecimalFormatted": "2,15"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,30"
                                            },
                                            {
                                                "oddsDecimalFormatted": "3,30"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ],
        "suppliers": {
            "1": {
                "supplierId": 1,
                "name": "fornitore1",
                "urls": {
                    "home_url": {
                        "value": "http://www.fornitore1.it"
                    },
                    "uri_logo_image": {
                        "value": "/fornitore1.gif"
                    }
                }
            },
            "3": {
                "supplierId": 3,
                "name": "fornitore2",
                "urls": {
                    "home_url": {
                        "value": "http://www.fornitore2.it"
                    },
                    "uri_logo_image": {
                        "value": "/fornitore2.gif"
                    }
                }
            },
            "4": {
                "supplierId": 4,
                "name": "fornitore3",
                "urls": {
                    "home_url": {
                        "value": "http://www.fornitore3.it"
                    },
                    "uri_logo_image": {
                        "value": "/fornitore3.gif"
                    }
                }
            }
        }
    }
}

Si tratta di dati relativi alle quote di una partita di calcio e dovrei popolare una tabellina dinamicamente, graficamente formattata nel modo giusto. Ho prodotto il seguente script, che però funziona a metà. Funziona "a metà" nel senso che mi stampa sia il nome della partita nell'h4 dell'intestazione andandomi a prendere il nome delle due squadre (.."orderedParticipants[0].name+" - "+partecipanti.orderedParticipants[1].name"...) sia pure le tre quote (quota1,quotaX,quota2) correttamente sulla riga della tabella (perchè i "suppliers" sono tre come si può vedere dall'oggetto chiamato proprio "suppliers" ed hanno un id differente, cosìcchè ad aumento/decremento dei suppliers il numero di righe cambiano):

Codice:
$(document).ready( function(){

	$.getJSON("my_file.json", function(data){

			var matches = data.model;
			var competizione = matches.competitions[0]; 
			
          		//partita: in questo caso solo la prima (il json ne prevederà una sola)
			var partecipanti = competizione.matches[0]; 
	
			//evento: in questo caso solo il primo (il json ne prevederà uno solo)
			var evento =  matches.competitions[0].events[0];

			var arraySupp = [];
			var arrayOdds = [];

			var tabella = $("table.info");
			var riga; 

			//stampo le due squadre nell'h4 dell'intestazione
			$(".box h4").append("<span>"+partecipanti.orderedParticipants[0].name+" - "+partecipanti.orderedParticipants[1].name+"</span>"); 
					
				
			$.each(evento.suppliers, function(index,value){
						
				quote = value.bets;
				//console.log(quote)
					
				arrayOdds.push(value.supplierId)
				//console.log(arrayOdds)

				$.each(value.bets, function(index, value){
					quote1 = value.bets[0].oddsDecimalFormatted;
					quoteX = value.bets[1].oddsDecimalFormatted;
					quote2 = value.bets[2].oddsDecimalFormatted;
					//console.log(quote1,quoteX,quote2) //qui funziona
				})

				//console.log(quote1,quoteX,quote2) //qui funziona

				riga = $(tabella).append("<tr><td class='fornitoriImg'></td><td>"+quote1+"</td><td>"+quoteX+"</td><td>"+quote2+"</td></tr>");

				})

				$.each(matches.suppliers, function(index, value){
					//console.log(index)
					//console.log(value)
					//console.log(value.supplierId)
					
                                        arraySupp.push(value.supplierId)
					//console.log(arraySupp)
					
                                        fornitori = value.name;
				        ulr_img = value.urls.home_url.value;
				        loghetti = value.urls.uri_logo_image.value;
					//console.log(fornitori)

					if (arraySupp[value] == arrayOdds[value]) {

						var imgFornitore = $("<span><a href='"+ulr_img+"'>"+"<img src='"+loghetti +"' />"+"</a></span>");

						$("table tr td.fornitoriImg").append(imgFornitore);
						
					}

				}) 
					
				//console.log(arraySupp)
				//console.log(arrayOdds)

			});

		});

Questo l'html:

Codice:
<div class="box">
		<h4></h4>	
		<table class="info"  cellspacing="0" cellpadding="0">
				
		</table>	
</div>


Ora la tabella dovrebbe essere cosi:

HTML:
<h4>SQUADRA_CASA - SQUADRA_TRASFERTA</h4>
<table>
<tr><td>imgFornitore</td><td>quota1</td><td>auotaX</td><td>quota2</td></tr>
<tr><td>imgFornitore</td><td>quota1</td><td>auotaX</td><td>quota2</td></tr>
<tr><td>imgFornitore</td><td>quota1</td><td>auotaX</td><td>quota2</td></tr>

n <tr>....

</table>

L'unica cosa che non riesco a stampare è l'immagine e il nome del fornitore in corrispondenza delle relative quote (la corrispondenza è data da un IF e dall'ID del fornitore).

Potete darmi una mano? Se necessitate di ulteriori delucidazioni non esitate a chiedere! Grazie anticipatamente
 
Discussioni simili
Autore Titolo Forum Risposte Data
D Stampare una query in una tabella MySQL 2
L PHP/MySQL: stampare da una tabella attributi raggruppati per genitore PHP 1
D Stampare valori dentro una tabella PHP 7
B Stampare una porzione della pagina PHP 0
elpirata [PHP] Stampare i valori di una variabile scritta su più righe PHP 1
webmachine [PHP] Problema: Stampare tutte le occorrenza di una SELECT PHP 2
elpirata Stampare a video in echo table il risultato di una query PHP 4
S Stampare una variabile in ogni pagina usando le sessioni PHP 5
D Stampare variabile da una funzione PHP 1
F stampare una select con php PHP 7
S Stampare il risultato di una query inner jon in php.... PHP 4
I Stampare due variabili da due pagine differenti in una terza pagina PHP 4
voldemort Javascript Print [Era: stampare una pagina con un link js] Javascript 2
F "Link Stampa" per stampare una pagina nascosta Javascript 4
D Stampare solo una pagina PHP 4
V Stampare una pagina Flash 1
L Stampare una pagina di riepilogo Classic ASP 9
G leggere file txt e stampare con php il contenuto a video PHP 7
F stampare a video i risultati della query PHP 1
elpirata Ricavare e stampare indirizzo ip da array associativo PHP 0
V Come stampare su Excel tabella con rowspan e colspan Javascript 2
elpirata Stampare carattere simbolo euro PHP 10
W Stampare file PDF in varie modalità. Windows e Software 5
L pdo (stampare un valore con ritorno a funzione) PHP 0
P [PHP] Aggiungere giorni e stampare risultato da data inserita in input PHP 3
P [PHP] Stampare record di diverse tabelle ma con nomi uguali PHP 6
K [PHP] Stampare tabella da database differenti. PHP 4
M Stampare con php e mysql PHP 8
L [PHP] stampare un'array di un database PHP 0
J modifica spooler di stampa per stampare in ordine di nome i files pdf Windows e Software 2
T PHP+MYSQL: stampare record con numero progressivo PHP 3
cristoforo58 Stampare dei valori XML in PHP PHP 0
K [PHP] Cancellare e Stampare tabella PHP 3
M [PHP] come stampare un Qr-code in FPDF PHP 8
M [Javascript] "Stampare" nel codice Var JS Javascript 5
N [PHP] stampare pagina html PHP 0
fulviozecchin [Java] Stampare intervallo tra due interi senza cicli Java 2
F [PHP] Stampare dati inviati tramite ajax PHP 0
elpirata [RISOLTO]Stampare giorno della settimana in tabella php PHP 6
elpirata [PHP] [RISOLTO] Stampare classe css in base al risultato della query PHP 6
Fuego2806 Stampare dati Form su immagine di sfondo con html HTML e CSS 1
Fuego2806 [PHP] Stampare dati Form su immagine di sfondo con html PHP 70
momeraths come stampare immagini contenute in un database PHP 7
I stampare in video i dati inseriti nel db PHP 1
M Sito "e-commerce", stampare dati di registrazione e dati dell'acquisto da pagine diverse PHP 7
L Stampare immagine php PHP 2
Shyson Stampare lista in ordine decrescente Database 1
A Stampare senza sidebar Javascript 0
F stampare array php PHP 3
N Non stampare valori duplicati PHP 1

Discussioni simili