В моих данных jQuery Thead и Tbody не выровнены ⇐ Jquery

[Anonymous]

В моем основном проекте ASP.NET я использовал DATATABLES JQUERY. Все идеально, кроме выравнивания заголовка стола и корпуса стола. Это произошло после того, как я добавил полосу прокрутки - до этого он был выровнен с tbody, но мне нужна прокрутка. Даже после того, как я сделал Autowidth True, это не сработало. Что мне делать? -JS lang-js prettyprint-override ">

Код: Выделить всё

/*function loadDynamicTable(axis, value, data) {
$.ajax({
url: '@Url.Action("GetDynamicTableData", "Admin")',
data: {
'axis': axis,
'value': value,
'data': data
},
type: 'GET',
success: function(response) {
if (response.success) {
if ($.fn.DataTable.isDataTable('#dynamicTable')) {
dataTable.destroy();
}
*/
const response = {
headers: ["Total", "Jul 22", "Aug 22", "Sep 22", "Oct 22", "Nov 22", "Dec 22", "Jan 23", "Feb 23", "Mar 23", "Apr 23", "Jun 23"],
data: [[123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789,123456789,123456789],[123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789, 123456789,123456789,123456789]]
}
$("#tableHeader").empty();
$("#tableBody").empty();

response.headers.forEach(function(header) {
$('#tableHeader').append('' + header + '');
});

let grandTotalRow = null;
let tableBodyHtml = "";

response.data.forEach(function(row) {
var rowHtml = '';
row.forEach(function(cell, index) {
if (index === 0) {
cell = cell === "Period Total" ? "Grand Total" : cell;
rowHtml += '' + cell + '';
} else {
rowHtml += '' + Number(cell).toFixed(2) + '';
}
});

rowHtml += '';

if (row[0] === "Grand Total") {
grandTotalRow = rowHtml;
} else {
tableBodyHtml += rowHtml;
}
});

$("#tableBody").html(tableBodyHtml);

if (grandTotalRow) {
$("#tableBody").append(grandTotalRow);
}

dataTable = $('#dynamicTable').DataTable({
destroy: true,
responsive: false,
scrollX: true,
paging: false,
searching: false,
ordering: true,
autoWidth: false,
info: false,
order: [],
drawCallback: function() {
var api = this.api();
var rows = api.rows().nodes();

$(rows).each(function() {
if ($(this).find("td:first").text().trim() === "Grand Total") {
$(this).appendTo("#tableBody");
$(this).addClass("grand-total-row");
}
});
}
});
/*

} else {
alert(response.message);
}
},
error: function() {
alert('Error fetching data.');
}
});
}*/< /code>
#tableBody tr:last-child td {
font-weight: bold;
background-color: #d9edf7;
}

#dynamicTable td:nth-child(2),
#dynamicTable th:nth-child(2) {
background-color: #d9edf7;
}

.text-right {
text-align: right;
}

.grand-total-row td:first-child {
background-color: transparent !important;
/*font-weight: normal !important;*/
}

.grand-total-row td:nth-child(2) {
background-color: #1a75ff !important;
color: white;
}< /code>

Подробнее здесь: https://stackoverflow.com/questions/794 ... ot-aligned