Я получаю следующую ошибку при попытке загрузить данные DataTables из источника ajax:
DataTables warning: table id=report-table - Ajax error. For more information about this error, please see http://datatables.net/tn/7
Ниже мой DataTables html:
<table id="report-table" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Page ID</th>
<th>Schema</th>
<th>Name</th>
<th>Last Modified</th>
<th>Last Modified User</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Page ID</th>
<th>Schema</th>
<th>Name</th>
<th>Last Modified</th>
<th>Last Modified User</th>
</tr>
</tfoot>
</table>
Ниже приведен мой javascript DataTables:
$('#report-table').DataTable({
"ajax": data,
"columns": [
{
"data": "PageId",
"orderable": true
},
{
"data": "SchemaName",
"orderable": false
},
{
"data": "Name",
"orderable": true
},
{
"data": "LastModified",
"orderable": true
},
{
"data": "LastModifiedUser",
"orderable": true
},
],
"order": [[3, "desc"]]
});
Ниже приведен подтвержденный json, который мой контроллер С# возвращает для данных ajax DataTables:
{
"data":[
{
"PageId":"foo",
"SchemaName":"foo",
"Name":"foo",
"LastModified":"foo",
"LastModifiedUser":"foo"
},
{
"PageId":"foo",
"SchemaName":"foo",
"Name":"foo",
"LastModified":"foo",
"LastModifiedUser":"foo"
},
{
"PageId":"foo",
"SchemaName":"foo",
"Name":"foo",
"LastModified":"foo",
"LastModifiedUser":"foo"
}
]
}
Ошибка, кажется, связана с форматом JSON, но не знаете, что не так?
РЕДАКТИРОВАТЬ:
Добавление полного кода javascript:
<script>
$(function () {
$("button#report-form-submit").click(function () {
event.preventDefault();
var data = $("form#report-form").serialize();
$.ajax({
type: "POST",
url: "@Url.Action("GetReportJson", "Report")",
data: data,
dataType: 'json',
beforeSend: function (data) {
},
success: function (data) {
// Report DataTables Init
// ===========================================
$('#report-table').DataTable({
"ajax": data,
"columns": [
{
"data": "PageId",
"orderable": true
},
{
"data": "SchemaName",
"orderable": false
},
{
"data": "Name",
"orderable": true
},
{
"data": "LastModified",
"orderable": true
},
{
"data": "LastModifiedUser",
"orderable": true
},
],
"order": [[3, "desc"]]
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
},
complete: function (data) {
}
});
});
});
</script>
0
31 Янв 2022 в 09:58
Видели ли вы ссылку, упомянутую в сообщении об ошибке: datatables.net/manual/tech-notes/7< /а> ? И выполнил шаги, чтобы получить фактическую ошибку.
–
31 Янв 2022 в 10:13
3 ответа
Поскольку ваш ответ JSON является объектом, а не массивом, укажите ajax, чтобы получить JsonResponse.data, как показано ниже:
"ajax": {
"url": /* Your Get Data API url */,
"dataSrc": function (json) {
return json.data;
},
},
ИЛИ
"ajax": {
"url": /* Your Get Data API url */,
"dataSrc": "data"
},
$.ajax({
type: "POST",
url: "@Url.Action("GetReportJson", "Report")",
data: data,
dataType: 'json',
beforeSend: function (data) {
},
success: function (json) {
var data = json.data;
// Report DataTables Init
// ===========================================
$('#report-table').DataTable({
"data": data,
...
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
},
complete: function (data) {
}
});
Выход
Ссылка
0
31 Янв 2022 в 10:44
Я должен был уточнить, что данные находятся в пределах успеха jquery ajax: функция (данные) обратного вызова. Редактирование поста с полным кодом javascript.
–
31 Янв 2022 в 10:34
Привет, сделал обновление моего ответа. Попробуйте использовать
–
data.
31 Янв 2022 в 10:46
Источник данных должен быть массивом массивов, содержащих данные в tbody сказать
data = [
["foo","foo","foo","foo","foo"],
["foo","foo","foo","foo","foo"],
["foo","foo","foo","foo","foo"]
];
См. пример [https://datatables.net/examples/data_sources/js_array.html][1]
Кроме того, используйте data: data.data вместо "ajax" : data
0
31 Янв 2022 в 10:51
Я заметил это, но считаю, что этот формат отлично работал в других проектах. Я знаю, что мне нужно было объявить данные столбца для свойств. Проблема в том, что Json.NET не сериализует объекты С# как массив массивов. Нет ли другого решения, если вы не можете изменить формат?
–
31 Янв 2022 в 10:40
Тогда вы просто используете
–
data: data.data вместо "ajax" : data
31 Янв 2022 в 10:48
Обновлено до «данных»: data.data и больше не возникает исходная ошибка. Теперь DataTables просто отображает «Нет доступных данных в таблице» после вызова. Ошибок консоли нет.
–
31 Янв 2022 в 11:20
«данные»: data.data возвращает неопределенное значение. Проверено, что мой ответ контроллера API возвращает json: "[{\"PageId\":\"foo\",\"SchemaName\":\"foo\",\"Name\":\"foo\",\" LastModified\":\"foo\",\"LastModifiedUser\":\"foo\"}]"
–
31 Янв 2022 в 11:47
Ваш блок <script> должен выглядеть так, чтобы инициализировать ваши данные для ваших таблиц данных:
<script>
$(function () {
$("button#report-form-submit").click(function () {
event.preventDefault();
var data = $("form#report-form").serialize();
$.ajax({
type: "POST",
url: "@Url.Action("GetReportJson", "Report")",
dataType: "json",
method: "post",
beforeSend: function (data) {
},
success: function (data) {
// Report DataTables Init
// ===========================================
$('#report-table').DataTable({
"data":data,
"columns": [
{
"data": "PageId",
"orderable": true
},
{
"data": "SchemaName",
"orderable": false
},
{
"data": "Name",
"orderable": true
},
{
"data": "LastModified",
"orderable": true
},
{
"data": "LastModifiedUser",
"orderable": true
},
],
"order": [[3, "desc"]]
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
},
complete: function (data) {
}
});
});
});
</script>
0
31 Янв 2022 в 12:08
En Español