Estoy teniendo un pequeño problema usando DataTables dentro de una modal bootstrap que debería mostrar un Query SQL con un SELECT no mas, necesito que pueda imprimirse en excel o algún otro formato pero estoy recibiendo un error en consola que dice: "DataTables Cannot read property 'aDataSort' of undefined" y frente a esa linea se ve "jquery-3.5.1.js:4055" entonces asumo que ese debe ser el problema.
Como necesito exportar los resultados como un formato, encontré esto en Datatables
https://datatables.net/extensions/buttons/examples/initialisation/export.html
Y es lo que trato de hacer.
Estuve leyendo en varias paginas y aquí también y parece que el problema es el orden de como están las dependencias, pero he intentado de varias maneras y no funciona, entonces no estoy seguro cual podrá ser el problema.
Estas son mis dependencias:
<meta charset="utf-8">
<meta name="viewport" content="width-device-width, initial-scale=1.0">
<link rel="stylesheet" href="../../bootstrap-4.5.0-dist/css/bootstrap.css" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css" integrity="sha384-Bfad6CLCknfcloXFOyFnlgtENryhrpZCe29RTifKEixXQZ38WheV+i/6YWSzkz3V" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script src="js/functions.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script src="js/datatables.js"></script>
<script src="js/Buttons-1.6.2/js/buttons.bootstrap4.js"></script>
<script src="js/DataTables-1.10.21/js/jquery.dataTables.js"></script>
<script src="js/JSZip-2.5.0/jszip.js"></script>
<script src="js/pdfmake-0.1.36/pdfmake.js"></script>
<script src="js/pdfmake-0.1.36/vfs_fonts.js"></script>
Esta es la tabla dentro de la Modal
<table id="tabla_a_mostrar"></table>
Esta es la función en el mismo archivo donde debe mostrarse la tabla (modal)
<script type="text/javascript">
$(document).ready(function() {
$('#tabla_a_mostrar').DataTable( {
dom: 'Bfrtip',
buttons: [
'copy', 'csv', 'excel', 'pdf', 'print'
]
} );
} );
</script>
Y esta es la tabla que se genera para el SELECT:
$tabla="";
if ($result) {
$data = sqlsrv_has_rows($result);
if ($data === true) {
while ($data = sqlsrv_fetch_array($result, SQLSRV_FETCH_ASSOC)){
$table=$table.'<tr>
<td>'.$data['ID'].'</td>
<td>'.$data['NOMBRE'].'</td>
<td>'.$data['APELLIDO'].'</td>
<td>'.$data['numero1'].'</td>
<td>'.$data['numero2'].'</td>
<td>'.$data['MOVIL'].'</td>
<td>'.$data['MRETIR'].'</td>
</tr>';
}
}
}
sqlsrv_close($conn);
echo '<table class="table table-stripped">
<thead>
<th>Id</th>
<th>Nombre</th>
<th>Apellido</th>
<th>Número 1</th>
<th>Número 2</th>
<th>Movil</th>
<th>Retirado?</th>
</thead>
<tbody>'.$tabla.'
</tbody>';
Eso es todo lo que tengo realmente... alguien puede ayudarme con este inconveniente? he tratado de resolverlo como por 2 días y no lo he logrado
Gracias!
echo '<table class="table table-stripped">...'
donde no se ve ID. Debo insistir en que modifiques la pregunta para ver cómo es que llega la tabla al DOM.