Estoy tratando de implementar Tablesorter con la función de buscapersonas. Importé todos los archivos js proporcionados en el sitio web de tablesorter. Aquí tengo mi sección 'head' de mi archivo Html:
<head> <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script> <script src="/js/jquery.tablesorter.pager.min.js"></script> <script src="/js/jquery.tablesorter.min.js"></script> <script src="/js/jquery.tablesorter.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.3/js/jquery.tablesorter.min.js" integrity="sha512-qzgd5cYSZcosqpzpn7zF2ZId8f/8CHmFKZ8j7mU4OUXTNRd5g+ZHBPsgKEwoqxCtdQvExE5LprwwPAgoicguNg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.5.0/chart.js"></script> <script type="text/javascript"> $(function() { $("#myTable") .tablesorter({ theme : "bootstrap", sortList: [[0, 0]] }, widthFixed: true }) .tablesorterPager({ size: 2, container: $("#myContainer") }); }); </script> </head>Con la siguiente tabla:
<table class="table table-bordered table-striped" id="myTable"> <thead class="thead-dark"> <tr> <th scope="col">№</th> <th scope="col">Name</th> <th scope="col">Price</th> </tr> </thead> <tbody> ... </tbody> <tfoot> <tr> <th colspan="3" class="ts-pager" id="myContainer"> ... </th> </tr> </tfoot> </table>Sin embargo, me sale este error:
$(...).tablesorter(...).tablesorterPager is not a function¿Qué ocurre? Hago todo como en la sección de demostración y en los tutoriales de youtube, pero aparece este error y no puedo darme cuenta de por qué.