Я недавно реализовал функциональность Datatables.Editor для своего веб-сайта ASPNET Core, и у меня возникают проблемы с получением данных, отражающих изменения во внешнем интерфейсе после того, как пользователь отправляет их. Данные на бэкенде корректно обновляются, и в веб-консоли не было ошибок.
Клиентская сторона
<script>
var editor;
$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
//ajax: "/api/sales/@Model.Id",
ajax: {
url: '/api/sales/@Model.Id',
dataSrc: '',
data: function (d) {
return JSON.stringify(d);
},
contentType: "application/json"
},
formOptions: {
inline: {
onBlur: true
}
},
idSrc: 'Id',
table: "#example",
fields: [{
label: "ID:",
name: "Id",
def: 0
}, {
label: "Name:",
name: "Name"
}, {
label: "Price:",
name: "SalePrice"
}, {
label: "Start Date:",
name: "StartDate",
type: "datetime"
}, {
label: "Finish Date:",
name: "FinishDate",
type: "datetime"
}]
});
var editIcon = function (data, type, row) {
if (type === 'display') {
return data + ' <i class="fas fa-pencil-alt"/>';
}
return data;
};
$('#example tbody').on('click', 'td i', function (e) {
e.stopImmediatePropagation(); // stop the row selection when clicking on an icon
editor.inline($(this).parent(), {
submit: 'allIfChanged'
});
});
$('#example').DataTable({
ajax: {
url: '/api/sales/@Model.Id',
dataSrc: '',
contentType: "application/json"
},
idSrc: 'Id',
dom: "Bfrtip",
columns: [
{ data: "Id" },
{ data: "Name", render: editIcon },
{ data: "SalePrice", render: editIcon },
{ data: "StartDate", render: editIcon },
{ data: "FinishDate", render: editIcon }
],
select: true,
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
});
});
</script>
Пример ответа GET:
[{"Id":1,"Name":"Test","StartDate":"2019-05-04T00:00:00","FinishDate":"2019-05-31T00:00:00","SalePrice":30.0}]
Пример тела сообщения:
{"action":"edit","data":{"1":{"Id":"1","Name":"Test","SalePrice":"30","StartDate":"2019-05-04","FinishDate":"2019-05-31"}}}
Пример ответа POST:
{"Id":1,"Name":"Test","StartDate":"2019-05-04T00:00:00","FinishDate":"2019-05-31T00:00:00","SalePrice":29.0}