How to create html table from simple json file

I have in Json array of fields like

[
    {
        "id": 1,
        "name": "test",
        "开发者_如何学JAVAlast_name": "test",
    },
    {
        "id": 2,
        "name": "test1",
        "last_name": "test1",
    },
    {
        "id": 2,
        "name": "test2",
        "last_name": "test2",
    }
]

How to create html table using jquery with columns id, name, last name ?

---

var json = [Your JSON here];
var $table = $('<table/>');

$.each(json, function(index, value) {
   //create a row
   var $row = $('<tr/>');

   //create the id column
   $('<td/>').text(value.id).appendTo($row);

   //create name column
   $('<td/>').text(value.name).appendTo($row);

   //create last_name
   $('<td/>').text(value.last_name).appendTo($row);

   $table.append($row);
});

//append table to the body
$('body').append($table);

Note this doesn't create a header row, but you can do this easily in the same manner.

Edit: Not really any need for jQuery here:

var json = [Your JSON here],
    table = document.createElement('table');

for(var i = 0, il = json.length; i < il; ++i) {
    //create row
    var row = document.createElement('tr'),
        td;

    //create the id column
    td = document.createElement('td');
    td.appendChild(document.createTextNode(json[i].id));
    row.appendChild(td);

    //create name column
    td = document.createElement('td');
    td.appendChild(document.createTextNode(json[i].name));
    row.appendChild(td);

    //create last_name column
    td = document.createElement('td');
    td.appendChild(document.createTextNode(json[i].last_name));
    row.appendChild(td);

    table.appendChild(row);
}

document.body.appendChild(table);

Obviously you can clean that up a bit to be more DRY, but you get the idea.

---

You can use the jQuery templates plugin for this. Here's the source code, and here's the documentation.

---

    my $json;
{
  local $/; #Enable 'slurp' mode
  open my $fh, "<", "C:/path_to_json_file/data.json";
  $json = <$fh>;
  close $fh;
}
my $data = decode_json($json);
my $array = $data->{'employees'};
print"<table cellpadding='0' cellspacing='0' border='0' class='pretty' id='example' >
    <thead>
         <tr>
        <th>SNo.</th>
        <th>Row1</th>
        <th>Row2</th>
        </tr>
    </thead>
    <tbody>";
foreach my $item (@$array){
    print "<tr>";
    print "<td>" . $item->{'SNo'} . "</td>";
    print "<td>" . $item->{'Row1'} . "</td>";
    print "<td>" . $item->{'Row2'} . "</td>";
    </tr>";
}
print "</tbody></table>

this is a simple perl cgi program which will create an html table from JSON file. you can see complete program at http://www.ssiddique.info/creating-html-table-using-json-file.html