Как исправить проблему с несовпадением столбцов в таблице данных ⇐ Jquery

[Anonymous]

У меня есть таблица данных JQuery с поиском по столбцу и горизонтальной прокруткой. Когда я нажимаю клавишу табуляции в заголовке таблицы, она перемещается, но тело таблицы не перемещается.
ниже приведен мой код.

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

 




Badge Number
Name
Completion Time






Category




var table=$('#example').DataTable({
// stateSave: true
"ordering": false,
"retrieve": true,
"fixedHeader": true,
"scrollX": true,
// "fixedColumns": {
//    left: 1
//  },

scrollY: '600px',
dom: 'lBfrtip',
buttons: [
{
extend: 'excel',
text: 'Export',
title:'Aluminum Coil Production Tracking Entries',
className: 'btn btn-primary',
header: true,
exportOptions: {
//columns: ':visible:not(.notexport)'
//columns: [':visible', 16,18,19 ]
columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
}
}],

});

// Apply the search
table.columns().every( function () {
var that = this;

$( 'input', this.header() ).on( 'keyup change', function () {

if ( that.search() !== this.value ) {
that.search( this.value )
.draw();
}
} );
} );

Номер значка
Имя
Время завершения

Категория

Я получаю сообщение о проблеме с дизайном, например на снимке экрана

[![введите описание изображения][1]][1]

Подробнее здесь: https://stackoverflow.com/questions/773 ... -datatable