DataTables warning: table id=example1 - Cannot reinitialise DataTable.
DataTables warning: table id=example1 - Cannot reinitialise DataTable.
Are you all right?
I'm having a problem and I need your help.
My application displays this error message: "DataTables warning: table id = example1 - Cannot reinitialize DataTable. For more information about this error, please see http://datatables.net/tn/3".
I have read in some places that it is important to start "Datatables" only once, but could not find a good solution. I've tried it in many ways, but in most of them I miss the translation to my language (Brazilian Portuguese). My code is following.
Can you tell me what I'm doing wrong?
Thank you all in advance!
<script>
$(document).ready(function() {
$('#example1').DataTable( {
"oLanguage": {
"sEmptyTable": "Nenhum registro encontrado",
"sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
"sInfoEmpty": "Mostrando 0 até 0 de 0 registros",
"sInfoFiltered": "(Filtrados de _MAX_ registros)",
"sInfoPostFix": "",
"sInfoThousands": ".",
"sLengthMenu": "_MENU_ resultados por página",
"sLoadingRecords": "Carregando...",
"sProcessing": "Processando...",
"sZeroRecords": "Nenhum registro encontrado",
"sSearch": "Pesquisar",
"oPaginate": {
"sNext": "Próximo",
"sPrevious": "Anterior",
"sFirst": "Primeiro",
"sLast": "Último"
},
"oAria": {
"sSortAscending": ": Ordenar colunas de forma ascendente",
"sSortDescending": ": Ordenar colunas de forma descendente"
},
"select": {
"rows": {
"_": "Selecionado %d linhas",
"0": "Nenhuma linha selecionada",
"1": "Selecionado 1 linha"
}
}
},
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel', 'pdf', 'print'
],
language: {
buttons: {
copyTitle: 'Copiado para área de transferência',
copyKeys: 'Pressione <i>ctrl</i> ou <i>\u2318</i> + <i>C</i> para copiar os dados da tabela para a área de transferência. <br> <br> Para cancelar, clique nesta mensagem ou pressione Esc.',
copySuccess: {
_: '%d linhas copiadas',
1: '1 linha copiada'
}
}
}
} );
// Setup - add a text input to each footer cell
$('#example1 thead tr').clone(true).appendTo( '#example1 thead' );
$('#example1 thead tr:eq(1) th').each( function (i) {
var title = $(this).text();
$(this).html( '<input type="text" placeholder="Procurar '+title+'" />' );
$( 'input', this ).on( 'keyup change', function () {
if ( table.column(i).search() !== this.value ) {
table
.column(i)
.search( this.value )
.draw();
}
} );
} );
var table = $('#example1').DataTable( {
orderCellsTop: true,
} );
} );
</script>
This question has accepted answers - jump to:
Answers
The link provides the steps to resolve the issue. The problem is with this:
This is the second initialization code that you have. Remove this and add the
orderCellsTop: true,
to the init code above.Kevin
Kevin, thank you very much for your attention, but in making the suggested change, another feature has stopped working.
By removing
orderCellsTop: true
and placing it at the beginning of the code, the search in each column no longer works.I think it's because you removed the table variable declaration.
Would you, or anyone, have any other suggestions?
Thanks again for your help.
My code, with the change you suggested, went like this.
You can declare the variable in line 2, for example:
var table = $('#example1').DataTable( {
Kevin
Kevin, how could I thank you for the immense help you gave me? Thank you. Worked perfectly. Sorry for my inexperience. I learned a lot from you.
Glad it all worked out
Kevin