Can't get datatables to work why?
Can't get datatables to work why?
solidsoul2011
Posts: 3Questions: 1Answers: 0
Followed directions - when I F12 in browser and view sources I can see the css, the JS and the Jquery loaded so I don't know why not working.. I've tried running the document.ready script in different locations and nothing working..
www.jeffdesjardins.com/playground/datatables
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Project Title</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.23/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.23/js/jquery.dataTables.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#table_idh').DataTable();});
</script>
</head>
<body>
<div class="container">
<table id="table_idh" class="display">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
</tr>
<tr>
<td>Row 2 Data 1</td>
<td>Row 2 Data 2</td>
</tr>
</tbody>
</table>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.min.js"></script>
</body>
</html>
Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
jquery.dataTables.js:56 Uncaught ReferenceError: jQuery is not defined
at jquery.dataTables.js:56
at jquery.dataTables.js:59
and
jquery-3.5.1.min.js:2 Uncaught TypeError: $(...).dataTable is not a function
at HTMLDocument.<anonymous> ((index):14)
at e (jquery-3.5.1.min.js:2)
at t (jquery-3.5.1.min.js:2)
The order of including CSS and JS files matters. For example datatables.js requires jquery.js so jquery.js needs to be loaded first. You can look at the load order of this example. You can also use the Download Builder to get the proper files and in the order needed.
Kevin
thank you very much - much appreciated..