Help ScrollX

victtorpb

Sorry for my english. I have a problem when using DataTable with sScollX, I searched the forum and not found. When I use the sScrollX a header more more appear.

[code]
$(document).ready(function() {
var oTable = $('#usuarios').dataTable({


"sDom": "<'row'<'col-sm-6'l><'col-sm-6'f>r>t<'row'<'col-sm-6'i><'col-sm-6'p>>S",
"sScrollX": "300%",
"sPaginationType": "full_numbers",
"oLanguage": {
"sZeroRecords": "Nenhum registro foi encontrado",
"sLengthMenu": "Exibir _MENU_ registros",
"sInfo": "_START_ até _END_ de _TOTAL_ registros",
"sInfoEmpty": "Nenhum registro a ser exibido",
"sInfoFiltered": "(filtrado do total de _MAX_ registros)",
"sProcessing": "Processando...",
"oPaginate":{
"sFirst":"Primeiro",
"sLast":"Último",
"sNext":"Próximo",
"sPrevious":"Anterior"
},
"sSearch": "Buscar:"
},
"bProcessing": true,
"bServerSide": true,
"aoColumns": [
{ "sTitle":'',"sClass": "center", "bSortable": false },
{ "sTitle":"id","bSortable": true },
{ "sTitle":"nome","bSortable": true },
{ "sTitle":"email","bSortable": false },
{ "sTitle":"perfil","bSortable": true },
{ "bSortable": false },


],
"sAjaxSource": "{{=URL('_usuarios')}}",


});

[/code]

Example: https://malucao866.pythonanywhere.com/test/usuario/listar
debug

allan

Please try using the Bootstrap 3 integration files from here: https://github.com/DataTables/Plugins/tree/master/integration/bootstrap/3

Allan

victtorpb

Thanks for the reply Allan. The suggestion did not work, the datatable continues with two header. Would have any other suggestions?

victtorpb

example page : https://malucao866.pythonanywhere.com/test/usuario/listar

allan

Can you try adding:

[code]
div.dataTables_scrollBody thead th,
div.dataTables_scrollBody thead td {
line-height: 0;
}
[/code]

It looks like your bootstrap file is adding line-height.

Allan

victtorpb

Allan, thanks. Added some other elements to your CSS to remove the sorting. Very good your work.

[code]
div.dataTables_scrollBody thead th,
div.dataTables_scrollBody thead td {
line-height: 0;
opacity:0.0;
width: 0px;
height:0px;
[/code]

Thanks