Menu
The error I had was:
"Uncaught TypeError: ba is undefined"
"https://cdn.datatables.net/v/dt/dt-1.10.22/b-1.6.5/b-print-1.6.5/r-2.2.6/datatables.min.js:119"
No other errors are shown. I put Jquery first in the list and checked all the paths work. I also got what I think is the most appropriate link from the datatables site.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ajax Filter table</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.22/b-1.6.5/b-print-1.6.5/r-2.2.6/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.22/b-1.6.5/b-print-1.6.5/r-2.2.6/datatables.min.js"></script>
<script>
$(document).ready(function(){
$('#table').DataTable();
})
</script>
</head>
<body>
<div class="container">
<table class="table table-striped" id="table">
<tr>
<th>one</th>
<th>two</th>
<th>three</th>
<th>four</th>
</tr>
<tr>
<td>one</td>
<td>two</td>
<td>three</td>
<td>four</td>
</tr>
</table>
</div>
</body>
</html>
958
The solution was to construct the table in a way that datatables likes. There is nothing about this on their homepage where they tell you it's just a case of importing 2 script files. But they require you to use thead and tbody elements. Without this it just falls over and the errors are not at all helpful in diagnosing this!
165
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
