Tengo el siguiente problema estoy haciendo una tabla de filtrado con dataTable y Ajax todo me funciona a la perfección puedo ver los registros y filtrar pero siempre que recargo la pagina me sale un alert con el mensaje:
DataTables warning: table id=alumnos - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3"
¿Alguien sabe que podría ser?
Aquí les dejo el código que tengo:
<link rel="stylesheet" href="../css/style_ex.css">
<table id="alumnos" class="display" style="width:100%">
<thead>
<tr>
<th>ID</th>
<th>Apellidos</th>
<th>Nombres</th>
<th>CI</th>
<th>Año</th>
<th>Sección</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script src="../js/jquery-3.3.1.js"></script> <link rel="stylesheet" href="../css/jquery.dataTables.min.css"> <link rel="" href="../css/fixedHeader.dataTables.min.css"> <script src="../js/datatables.min.js"></script> <script src="../js/search.js"></script>
<script>
$(document).ready(function() {
$('#alumnos').DataTable({
"ajax":{
"url": "consulta.php",
"dataSrc":""
},
"columns":[
{"data": "id"},
{"data": "apellidos"},
{"data": "nombres"},
{"data": "cedula"},
{"data": "grado"},
{"data": "seccion"}
]
});
});
$(document).ready(function(){
var table = $('#alumnos').DataTable({
orderCellsTop: true,
fixedHeader: true
});
//Creamos una fila en el head de la tabla y lo clonamos para cada columna
$('#alumnos thead tr').clone(true).appendTo( '#alumnos thead' );
$('#alumnos thead tr:eq(1) th').each( function (i) {
var title = $(this).text(); //es el nombre de la columna
$(this).html( '<input type="text" placeholder="Buscar por...'+title+'" />' );
$('input', this ).on( 'keyup change', function () {
if ( table.column(i).search() !== this.value ) {
table
.column(i)
.search( this.value )
.draw();
}
});
});
});
</script>