如何使用$ .ajax {}使用ajax更新html

Question

我有從JavaScript調用控制器方法並返回json對象的javascript。 返回json對象后，我想更新搜索字段下方的表格，該表格將顯示json對象的結果。 基本上，我試圖列出所有對象，但要基於對表單的某些搜索來過濾出結果。

以下是我用來獲取json對象的示例代碼：

$.ajax({
  type: "GET",
  dataType: "json",
  url: "/students/search/" + this.value,
  success: function(data){
    // logic to update field
  });
});

更新：

JSON對象：

[{"student":{"student_type":"D", "student_name":"Blah Blah"}}]

我的html中有一個表格：

<table id="studentTable">
</table>

我想將student_type和student_name添加到表中

Answer 1

假設從控制器返回的數據是一個對象數組，我在以前的項目中已經做了類似的事情：

使用jQuery模板插件：

$.each(data, function(index, element) {
var t = $.template("<tr><td>${student_type}</td><td>${student_name}</td></tr>");

var tdata = {
    student_type: element.student.student_type,
    student_name: element.student.student_name
};

$("#studentTable").append(t, tdata);

});

所有這些都應該放在成功回調函數中。 如果您可以提供視圖中html的html以及從控制器返回的JSON，我可以更新我的答案以更好地反映您的情況。