0

Json データに基づく未定義の列を含むグリッドを作成する必要があります。 

[{
    Name: "John",
    Designation: "Analyst",
    Age: 25, 
    Department: "IT"
},
{
    Name: "Matthew",
    Designation: "Manager", 
    Age: 38, 
    Department: "Accounts"
},
{
    Name: "Emma",
    Designation: "Senior Manager",
    Age: 40,
    Department: "HR"
}];

私の望む出力は以下の通りです：

ヘッダーとして:

Name | Designation | Age | Department

データ行として:

John | Analyst | 25 | IT

どうやって始めなければならないのか、どうすればいいのか、誰か助けてください。

4

4 に答える 4

0

for...in ループは、必要なことを正確に実行します。

Mozilla Developer Network がそれについて書いているのは次のとおりです: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in

"for...in ループ内では、プロパティに指定されたプロパティがあるかどうか、およびこのプロパティが継承されていないかどうかをテストすることが重要です。( hasOwnProperty )

作業例: http://jsbin.com/ecoqax/1/edit

ここでjQueryを使用しています：

var $theader = $("thead"),
    $tbody = $("tbody"),
    hasHeader = false,
    html = "";

  // data is the converted JSON data
  for (var i = 0; i < data.length; i++) {
    // the current person
    var person = data[i];

    html += '<tr>';

    // iterating over every property of the person object
    for (var prop in person) {
      if (person.hasOwnProperty(prop)) {
        // insert the header once
        if (hasHeader === false) {
          $theader.append($('<th>'+prop+'</th>'));
        }
        html += '<td>'+person[prop]+'</td>';
      }
    }

    // after the first iteration the header is added
    hasHeader = true;
    html += '</tr>';
  }

  $tbody.append($(html));
于 2013-07-15T12:36:14.677 に答える
0

重複した質問JSONデータをhtml / javascriptグリッドテーブルに配置する方法 [投稿する前に確認する場合]
これはデータテーブルです-http ://datatables.net/release-datatables/examples/data_sources/js_array.html
これはグリッドテーブル JSです- http://backgridjs.com/#examples

于 2013-07-15T12:16:17.120 に答える