I'm trying to implement JQuery datatables in my play application.
Here is my code
#{extends 'main.html' /}
#{set title:'Customers List' /}
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/demo_table.css'}">
<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/demo_page.css'}">
#{set 'moreScripts'}
<script src="@{'/public/javascripts/jquery-1.5.2.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/javascripts/jquery.dataTables.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/javascripts/jquery.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script>
$(document).ready( function() {
oTable = $('#example').dataTable();
});
</script>
#{/set}
<div class="others" align="center">
<table width="100%" cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
<tr>
<th>Header1</th>
<th>Header2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Col1</td>
<td>Col2</td>
</tr>
</tbody>
</table>
</div>
When i run the page javascript throws an error
$("#example").dataTable is not a function
I checked all javascript/css files. All files were included. What could be the error.