ASP.NET Core 3.0 Razor 数据表 Ajax 不显示 JSon 数据

Question

我有一个页面，里面有一个表，有一列，使用DataTables;我用ajax调用加载数据。

数据返回到页面，但表不显示任何行。我在浏览器上没有任何错误显示。

这是我使用 JQuery 的 HTML：

<div>
<table class="table table-bordered" id="DetailsTable" width="100%" cellspacing="0"</table>
</div>
<script>
jQuery(function () {
$('#DetailsTable').DataTable({               
"responsive": true,
"processing": true,
"serverSide": true,               
"ajax": {
"url": "/Index?handler=Table",
"type": "GET",
"dataSrc": "",
"dataType": "json"
},
"columnDefs": [
{ "targets": "detail_ID", visible: true }
],
"columns": [
{ "data": "detail_ID" }]
});
});
</script>

这是我的方法：

public async Task<IActionResult> OnGetTableAsync()
{
wItem = await _detailRepo.Finddetail(CancellationToken.None);
string NewtonJSON = JsonConvert.SerializeObject(wItem);
return Content(NewtonJSON);
}

这是重新命名的 JSON：

{
"detail_ID": 7,
"detail_GUID": "685b8741-fe22-460a-bb76-7ecd9c320172"
}

有什么建议吗？

Answer 1

首先，您不需要将结果转换为 json - Web API 在 C# 中为您处理：

public async Task<IActionResult> OnGetTableAsync()
{
var wItem = await _detailRepo.Finddetail(CancellationToken.None);
//string NewtonJSON = JsonConvert.SerializeObject(wItem);
return Content(wItem );
}

我认为您可能希望将返回类型更改为确定：

public async Task<IActionResult> OnGetTableAsync()
{
var wItem = await _detailRepo.Finddetail(CancellationToken.None);
return Ok(wItem );
}

并返回一个列表(以适应表格(

public async Task<IActionResult> OnGetTableAsync()
{
var wItem = await _detailRepo.Finddetail(CancellationToken.None);
return Ok(new List<object> {wItem} );
}

我相信这应该返回如下内容：

[{
"detail_ID": 7,
"detail_GUID": "685b8741-fe22-460a-bb76-7ecd9c320172"
}]

哪个应该与表格更兼容

您可能还必须更改 ajax 调用的"ajax"部分：

"ajax": {
"url": "/Index?handler=Table",
"type": "GET",
"dataType": "application/json"
}

更新：看起来您需要返回特定对象，查看此处的示例

所以你需要让你的对象看起来像这样：

{
"data": [{
"detail_ID": 7,
"detail_GUID": "685b8741-fe22-460a-bb76-7ecd9c320172"
}]
}

最简单的方法可能是更新您的服务器端，如下所示：

public async Task<IActionResult> OnGetTableAsync()
{
var wItem = await _detailRepo.Finddetail(CancellationToken.None);
return Ok(new { data = new List<object> {wItem} });
}

我相信有一个用于数据表的 .Net nuget 包，它会给你一个更合适的类型来返回

希望这有帮助