DataTables
DataTables turns any HTML table into a powerful, sortable, searchable, and paginated data grid with a single line of JavaScript.
jQuery
Intermediate
4 min read
Using DataTables Plugin
Example
<!-- DataTables CSS + JS (with Bootstrap 5 integration) -->
<link href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css" rel="stylesheet">
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
<script>
$(document).ready(function() {
$("#usersTable").DataTable({
pageLength: 25,
order: [[0, "asc"]]
});
});
</script> Pro Tip
Use DataTables' server-side processing for tables with thousands of rows.