Adding scrollX options hides header Lable.

monikav

Adding scrollX: true hides the header label. Other header configurations are shown.

$('#renewal_table').DataTable({
responsive: false,
ScrollX: true,
"dom": '<"top"if>rt<"bottom"lp>',
"pageLength": 10,
"columnDefs": [
{"responsivePriority": 1, "orderable": false, "width": "3%", "targets": 0,'checkboxes': {'selectRow': true}},
{"responsivePriority": 2, "width": "31%", "targets": 1},
{"responsivePriority": 3, "width": "20%", "targets": 2},
{"responsivePriority": 6, "width": "9%", "targets": 3},
{"responsivePriority": 4, "width": "14%", "targets": 4},
{"responsivePriority": 5, "width": "14%", "targets": 5},
{"responsivePriority": 7, "width": "9%", "targets": 6}
],
select: {
style: 'os',
selector: 'td:first-child'
},
order: [[ 0, 'asc' ]],
fixedColumns: true,
"oLanguage": {
"sLengthMenu": '<span class="label">Show:   </span><select>'+
'<option value="10">10</option>'+
'<option value="20">20</option>'+
'<option value="30">30</option>'+
'<option value="40">40</option>'+
'<option value="50">50</option>'+
'<option value="-1">All</option>'+
'</select>',
"sLoadingRecords": "Please wait - loading more renewals...",
"sProcessing": "The table is currently busy.",
"sSearch": "",
"sZeroRecords": "You have no renewals to display."
},
"language": {
"info": "Displaying START to END of TOTAL renewals",
"infoFiltered": " (of MAX renewals)",
"searchPlaceholder": "Search for a Renewal"
},
"fnDrawCallback": function(oSettings) {
if (oSettings._iDisplayLength > oSettings.fnRecordsDisplay()) {
$(oSettings.nTableWrapper).find('.dataTables_paginate').hide();
$(oSettings.nTableWrapper).find('.dataTables_length').hide();
}
},
"drawCallback": function () {
$('.dataTables_wrapper').addClass('renewals-datatable');
},
'rowCallback': function( row, data, index ){
if(data[6] == 'In Cart'){
$('td:eq(0)', row).html('');
$(row).addClass('no-select');
} else {
$(row).removeClass('no-select');
}
},
'initComplete': function( settings, json ) {
$('#renewal_table').show();
$('.renewals-table-container .loading-indicator').remove();
}
});

kthorngren

You have ScrollX: true, which is incorrect. The scrollX option should look like this scrollX: true with a lowercase s. Not sure why adding an invalid option would cause problems. Datatables normally ignores those. In order to help we will need a link to your page or a test case replicating the issue.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

See if you have errors in your browser's console.

Kevin