Full and running example of datatables, please
Full and running example of datatables, please
Hi, I'm trying to find a complete example of datatables but I'm always missing something...
Can please someone tell me where to find a complete example that I can download (or an example with the links and script references working? Thanks
In github: https://github.com/DataTables/DataTables
The example code gives me errors when executed locally....
Failed to load resource: net: jquery-1.12.4.js :ERR_FILE_NOT_FOUND
Uncaught ReferenceError: jQuery is not defined jquery.dataTables.js:56 at jquery.dataTables.js:56 at jquery.dataTables.js:59
Uncaught ReferenceError: $ is not zero_configuration1.html:25 defined at zero_configuration1.html:25
Can please someone tell me where to find a complete example that I can download (or an example with the links and script references working? Thanks
This question has an accepted answers - jump to answer
Answers
https://datatables.net/examples/basic_init/zero_configuration.html
Full code is available on that page.
You don't seem to understand that DataTables requires jQuery. Use your browser's "View source" on the example page to see the full HTML including necessary script and CSS files.
Alternatively, read the manual.
https://datatables.net/manual/installation
Thanks Tangerine!!!!
But the calls to this source does not work so the tables does work either... Sorry, I got to be doing sometthing really stupid but
src="//code.jquery.com/jquery-1.12.4.js"
Thanks Tangerine
In this basic code it fails to load all the resources:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Zona</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css">
<style type="text/css" class="init"></style>
$(document).ready(function () { $('#example').DataTable(); });<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.15/css/jquery.dataTables.css">
</head>
<body>
<div>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>30</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Looks like you are loading the Datatables CSS twice. You should only load it once plus you are still missing jQuery and Datatables JS files.
You need to specify the path to the JS file, more like this:
src="http://code.jquery.com/jquery-1.12.4.min.js"
Take a look here for a default example:
http://live.datatables.net/
This is a Datatables test site. In your environment you will want to load a specific (1.10.15) version of Datatables instead of the nightly version loaded in the example.
Kevin
Thanks a lot Kevin and Tangerine!!!
Dont you think that this: http://live.datatables.net/ should be advertised in the Basic initialization?
Thanks you!
Interesting point, @Tonterias.
It is covered in this post:
https://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read
but of course it is very difficult to keep useful information in places where users can't fail to see it.
I'll add it to the text that is shown when creating a new thread - thanks for the suggestion.
Allan