- 首先,您需要在 Razor 页面中引用 jQuery 库。
- 接下来,在 Razor 页面中添加表格,并将其 ID 设置为 "grid"。
- 然后,您需要编写一个 JavaScript 函数来执行 Ajax 请求并填充表格。以下是一个例子:
function loadData() {
$.ajax({
url: "/api/customer",
method: "GET",
dataType: "json",
success: function (data) {
$.each(data, function (index, item) {
$("#grid tbody").append("
" + item.id + " | " + item.name + " | " + item.age + " |
");
});
},
error: function (errorMessage) {
alert(errorMessage.responseText);
}
});
}
- 最后,在 Razor 页面中添加一个按钮,并将其单击事件绑定到 loadData 函数。
- 点击该按钮后,将执行 loadData 函数并向 /api/customer 发送 GET 请求。当请求成功时,将使用 jQuery 的 each 函数迭代数据并将其添加到表格中。
这样,您就可以在 Razor 页面中使用 Ajax 表格并解决相关的请求问题了。