jsonデータをフィルタリングしてテーブルに結果を表示する

Question

私はユーザ入力を求めており、入力値に基づいてjsonオブジェクトを返します。私は、返されたオブジェクトを取って、オブジェクトのいくつかのアイテムをテーブルの中に表示して、ユーザに見せたいと思います。私がこれをやっているやり方がもっとクリーンであるか、まっすぐであるかどうかはわかりません。ここ

は私がこれまで持っているものです。

htmlファイルに：

私のjsファイル内

<form> 
    <input type="text" id="searchValue" required> 
    <input type="button" value="Submit" 
     onclick="getData(document.getElementById('searchValue').value)"> 
</form> 

：

classrooms: Array[2] 
    0: Object 
    className: "math", 
    startDate: "1/1/2016" 
    ..... 
    1: Object 
    ....... 
    ....... 

：

function getData(userInput) { 
    return $.getJSON('url/info' + userInput); 
} 
$(function() { 
    getData().done(function(json) { 
     //what do i need to do here so that the contents of this object will be available in the html file. 
    }); 
}); 

返されるオブジェクトはのようになります

私は結果の返却時に表示されますテーブル形式で返された情報とディスプレイを利用したいLD：

<table id="classesOffered" class="hidden"> 
    <tr> 
     <th>Class Name</th> 
     <th>Start date)</th> 
     <th>Something else</th> 
    </tr> 
</table> 

Answer 1

対象として戻ってくるデータを仮定すると、あなたはこのような何かを行うことができます。それがjson文字列の場合は、forEach()を実行する前に解析する必要があります。

function getData(userInput) { 
    return $.getJSON('url/info' + userInput); 
} 
$(function() { 
    getData().done(function(json) { 
     var table = $('#classesOffered'); 
     json.forEach(function(class) { 
     table.append(
      '<tr>' + 
      '<th>' + class.className + '</th>' + 
      '<th>' + class.startDate + '</th>' + 
      '<th>' + class.somethingElse + '</th>' + 
      '</tr>' 
     ); 
     }); 

    }); 
});