Hello Developers , I have a problem with datatables , not working properly . please help
Hello Developers , I have a problem with datatables , not working properly . please help
voiletlight80
Posts: 1Questions: 1Answers: 0
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link type="text/css" rel="stylesheet" href="../bootstrap-3.3.7/dist/css/bootstrap.min.css">
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css">
</head>
<body>
<table class="table table-striped" id="post_table">
<thead>
<tr>
<th>id</th>
<th>Post Title</th>
<th>Description</th>
<th>Category</th>
<th>Event Name</th>
<th>Status</th>
<th>Upload picture</th>
<th>Post date</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Wedding ceremnony</td>
<td>Mehndi held at green town, The best dinner is planned there, our employees did great job</td>
<td>Wedding</td>
<td>Mehndi</td>
<td>Published</td>
<td></td>
<td>20-01-2018</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>2</td>
<td>Wedding ceremnony</td>
<td>Waleema held at green town, The best dinner is planned there, our employees did great job</td>
<td>Wedding</td>
<td>Waleema</td>
<td>Published</td>
<td></td>
<td>01-01-2018</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>3</td>
<td>Musical Night</td>
<td>Mehndi held at green town, The best dinner is planned there, our employees did great job</td>
<td>Party</td>
<td>DJ Night</td>
<td>Published</td>
<td></td>
<td>20-01-2014</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>4</td>
<td>Wedding ceremnony</td>
<td>Mehndi held at green town, The best dinner is planned there, our employees did great job</td>
<td>Wedding</td>
<td>waleema</td>
<td>Published</td>
<td></td>
<td>20-01-2015</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>5</td>
<td>Wedding ceremnony</td>
<td>Barat held at green town, The best dinner is planned there, our employees did great job</td>
<td>Wedding</td>
<td>Barat</td>
<td>Published</td>
<td></td>
<td>20-03-2016</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>6</td>
<td>Musical night</td>
<td>Concert is held at green town, The best dinner is planned there, our employees did great job</td>
<td>Concert</td>
<td>Musical Night</td>
<td>Published</td>
<td></td>
<td>13-01-2017</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
<tr>
<td>7</td>
<td>Party</td>
<td>Birthday held at green town, The best dinner is planned there, our employees did great job</td>
<td>Party</td>
<td>Birthday</td>
<td>Published</td>
<td></td>
<td>1-01-2017</td>
<td><a href="edit-post.php">Update</a><span>/</span><a href="posts-details.php">View Details</a><span>/</span><a href="#">Delete</a></td>
</tr>
</tbody>
</table>
</body>
</html>
<script>
$(document).ready(function(){
$('#post_table').DataTable();
});
</script>
Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
This discussion has been closed.
Answers
The header row only has 8 columns while the body rows have 9. That's the issue with the above.
With an extra column in the header: http://live.datatables.net/nowutiye/1/edit .
Allan