0
1K
ViewsTypeError: $(...).DataTable no es una función
Estoy tratando de trabajar con Datatable JS de jQuery para mi proyecto desde este enlace.
Descargué la biblioteca completa de la misma fuente. Todos los ejemplos dados en el paquete parecen funcionar bien, pero cuando trato de incorporarlos en mis WebForms , CSS, JS no funcionan en absoluto.
Esto es lo que he hecho:
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <link href="css/jquery.dataTables.css" rel="stylesheet" type="text/css" /> </head> <body> <form id="form1" runat="server"> <div> <table id="myTable" class="display" cellspacing="0" width="100%"> <thead> <tr> <th>Name</th> <th>Position</th> <th>Office</th> <th>Age</th> <th>Start date</th> <th>Salary</th> </tr> </thead> <tfoot> <tr> <th>Name</th> <th>Position</th> <th>Office</th> <th>Age</th> <th>Start date</th> <th>Salary</th> </tr> </tfoot> <tbody> <!-- table body --> </tbody> </table> </div> <script src="js/jquery.dataTables.js" type="text/javascript"></script> <script src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { $('#myTable').DataTable(); }); </script> </form> </body> </html>Mi estructura de archivos para JS y CSS en mi solución se ve de la siguiente manera:
He agregado todas las referencias JS y CSS necesarias como se muestra en el manual. Aún así, la representación no es la esperada. No hay CSS e incluso el JS no funciona.
También en la consola obtengo los siguientes errores:
ReferenceError: jQuery is not defined TypeError: $(...).DataTable is not a functionTodavía no he vinculado ningún dato dinámico aquí (como dentro de un repetidor más o menos) y todavía no funciona.
¿Puede alguien guiarme en la dirección correcta para este problema?
3 answers
Answer question0
CAUSA
Puede haber varias razones para este error.
- Falta la biblioteca jQuery DataTables.
- La biblioteca jQuery se carga después de jQuery DataTables.
- Se cargan varias versiones de la biblioteca jQuery.
SOLUCIÓN
Incluya solo una versión de la biblioteca jQuery versión 1.7 o posterior antes de jQuery DataTables.
Por ejemplo:
<script src="js/jquery.min.js" type="text/javascript"></script> <script src="js/jquery.dataTables.min.js" type="text/javascript"></script>Consulte jQuery DataTables: errores comunes de la consola de JavaScript para obtener más información sobre este y otros errores comunes de la consola.
0
Esto funcionó para mí. Pero asegúrese de cargar jquery.js antes del archivo dataTable.js preferido. ¡Salud!
<script type="text/javascript" src="~/Scripts/jquery.js"></script> <script type="text/javascript" src="~/Scripts/data-table/jquery.dataTables.js"></script> <script>$(document).ready(function () { $.noConflict(); var table = $('# your selector').DataTable(); });</script>0
Recibí este error porque descubrí que hice referencia a jQuery dos veces.
La primera vez: en la página maestra ( _Layout.cshtml ) en ASP.NET MVC, y luego nuevamente en una página actual, así que comenté la de la página maestra.
Si está utilizando ASP.NET MVC, este fragmento podría ayudarlo
@*@Scripts.Render("~/bundles/jquery")*@//comment this line @Scripts.Render("~/bundles/bootstrap") @RenderSection("scripts", required: false)y en la página actual agregué estas líneas
<script src="~/scripts/jquery-1.10.2.js"></script> <!-- #region datatables files --> <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" /> <script src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> <!-- #endregion -->Espero que esto te ayude incluso si no usas ASP.NET MVC