фильтрация данных json и отображение результатов в таблице

Question

Я прошу ввести данные пользователя и на основе их входного значения i вернет объект json. Я хотел бы взять возвращаемый объект и отобразить несколько элементов из объекта в таблице для просмотра пользователем. Я не уверен, способ, которым я это делаю, быть более чистым или прямым.

вот что я до сих пор:

в HTML файле:

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

в моем JS файл:

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. 
    }); 
}); 

возвращаемый объект выглядит примерно так:

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

I wou Л.Д. хотел взять возвращенное информацию и отображать в виде таблицы, которая будет видна после возвращения результатов:

<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>' 
     ); 
     }); 

    }); 
});