Я новичок в работе с таблицами данных jQuery, использующими AJAX в ASP.NET Core 6 MVC. Я включил свой code как в представление, так и в контроллер. Я пытаюсь получить данные от контроллера и отобразить их в представлении, содержащем DataTable, при нажатии кнопки.
Представление:
Контроллер:
Контроллер возвращает следующие две строки данных.
Однако я получаю всплывающее сообщение об ошибке, и данные не отображаются в сетке. В пустой сетке написано: "В таблице нет данных".
<div>
<div style="padding-top: 20px; padding-bottom:20px">
<button class="btn btn-lg btn-primary" onclick="javascript:runReport();">Run
Report</button>
</div>
<div>
<table class="table table-bordered table-striped" id="riskReport">
<thead class="bg-dark text-white">
<tr>
<th>CustomerNumber</th>
<th>CustomerStatus</th>
<th>StartDate</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
@section Scripts {
@{
<partial name="_ValidationScriptsPartial" />
<partial name="_DataTableCDN" />
}
<script>
function runReport() {
var reportData;
var dataTableOptions = {
"paging": true,
"lengthChange": false,
"searching": false,
"ordering": true,
"info": true,
"autoWidth": false,
"responsive": true,
"columnDefs": "",
"ajax": {
url: "/Reports/ProcessReport",
type: "POST",
data: reportData,
// "datatype": "json",
"error": function (e) {
alert(e)
},
"dataSrc": function (d) {
alert(JSON.stringify(d))
// return JSON.stringify(d);
return d;
},
"columns":[
{ "data": "customerNumber", "name": "CustomerNumber", "autoWidth":
true },
{ "data": "customerStatus", "name": "CustomerStatus", "autoWidth":
true },
{ "data": "startDate", "name": "StartDate", "autoWidth": true }
]
}
}
reportData = $('#reportForm').serializeArray();
var myDataTable = $('#riskReport').DataTable(dataTableOptions);
}
</script>
[HttpPost]
public async Task<JsonResult> ProcessReport(ReportsConfigurationVM reportsConfigurationVM)
{
List<RiskByYearTest> myList = new List<RiskByYearTest>();
RiskByYearTest r1 = new RiskByYearTest();
r1.CustomerNumber = "4549601";
r1.CustomerStatus = "Active";
r1.StartYear = "2022";
RiskByYearTest r2 = new RiskByYearTest();
r2.CustomerNumber = "4549602";
r2.CustomerStatus = "Closed";
r2.StartYear = "2023";
myList.Add(r1);
myList.Add(r2);
var result = Json(myList);
return result;
}
[
{
"customerNumber": "4549601",
"customerStatus": "Active",
"startYear": "2022"
},
{
"customerNumber": "4549602",
"customerStatus": "Closed",
"startYear": "2023"
}
]
Август
Вопрос задан19 мая 2024 г.