javascript - Populating a table with an object with JQuery -


i have array of objects object [{date, count, city}]

lets have data

[{01/01/01, 10, new york}, {01/01/01, 15, london}, {01/01/01, 16, rome},{02/01/01, 40, new york},{02/01/01, 25, london}, {02/01/01, 36, rome}]

i want populate html table using jquery , have following result

date     | new york | london | rome 01/01/01 | 10       | 15     | 16 02/01/01 | 40       | 25     | 36 

is possible generate table similar jquery?

this code have done far

for (var = 0; < countresult.length; i++) {         var html = "<table><thead><tr><th>date</th><th>city</th><th>count</th></thead><tbody>";         (var j = 0; j < countresult[i].length; j++) {             html += "<tr>";             html += "<td>" + countresult[i][j].date + "</td><td>" + countresult[i][j].city + "</td><td>" + countresult[i][j].count+ "</td>";         }         html += "</tr>";          html += "</tbody></table></br>";         $(html).appendto("#div");     } 

the solution question was:

    var countresult = [           ["01/01/01", 10, "new york"],           ["01/01/01", 15, "london"],            ["01/01/01", 16, "rome"],            ["02/01/01", 40, "new york"],            ["02/01/01", 25, "london"],           ["02/01/01", 36, "rome"]          ]       var cities = []     $.each(countresult, function(rownum, row) {        var city = row[2];              if($.inarray(city, cities) < 0) cities.push(city);          });      var html = "<table><thead><tr><th>date</th>"        + $.map(cities, function (c) {                  return "<th>" + c           }).join("") + "</tr></thead><tbody>";                var summary = {};      $.each(countresult, function       (rownum, row) {               if(!summary[row[0]]) summary[row[0]] = {}             summary[row[0]][row[2]] = row[1];           });      $.each(summary, function (date, counts) {              html += "<tr><td>" + date;         $.each(counts, function (i, ct) {                 html += "<td>" + ct     ;          });               html += "</tr>";           });           $(html).appendto("#div"); 

Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -