How to Make Datatables Faster By Using Ajax
 |
| Datatables Ajax Load |
Here's how you can make a Datatables not loading all the rows in one page load, but rather doing ajax call per table page.
<html>
<head>
<title>Datatable</title>
<link href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"/>
<script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
</head>
<body>
<table id ="datatable"></table>
<script>
$("#datatable").DataTable({
dom: "Bfrtip",
processing: true,
serverSide: true,
ajax : "http://localhost/data",
});
</script>
</body>
</html>
Just simple as that actually, the hard thing you gonna do is on the Server side. In PHP you can check whatever $_POST and $_GET being sent from Datatables, you can get that information to do table filtering, paging, sorting, etc.
In a web desktop based software, displaying tabular data is one thing that we do almost all the time. Making our table sort able, searchable, page able, is a must. We don't want our user to mad at us because the performance not doing good. If you don't now There's Datatables Javascript library.
Since the presence of React, i would say this is kind of approach is kind of old fashion way to display a table using Javascript. But still people still use it, even me, because it's convenient, simple and easy to do.
