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:
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):
Questo l'html:
Ora la tabella dovrebbe essere cosi:
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
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
