Newbie - need help with 'Basic Initialization' with zero config
Newbie - need help with 'Basic Initialization' with zero config
csr
Posts: 4Questions: 1Answers: 0
I create a single html file and included everything in it to demo Datatable. But it doesn't show any enhanced html table. What am I missing? Thx!
Below is my html file.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<script>
$(document).ready(function() {
$('#example').DataTable();
});
</script>
</head>
<body>
<table id="example" class="display" style="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>
<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>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
</table>
</body>
</html>
This discussion has been closed.
Answers
I copied your code into this example:
http://live.datatables.net/gatikeso/1/edit
Take a look at the browser's console for errors. Can you post a link to your page so we can help debug?
Kevin
It is weird but your example seems to work okay. I opened the html file I created in Firefox and IE and it didn't work in either. I created a simpler script with 'Click me' and that works (which says to me that Javascript is enabled in the browser).
I have an html file that I created. Is it possible to attach that file to this post? Or can you tell me where I can post the page itself?
Thanks.
Did you look at the browser's console for errors? If so what errors do you get?
I took your example and copied it into the test case I posted above. You can try one of the other options listed here:
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
I copied your above code to a local file and opened it just fine. I'm not sure of another way to provide it that would change anything.
Kevin
What does your browser's address bar say after you opened the HTML file?
error check - on right-clicking on document > inspect element > console > i got this - "The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol."
I inserted this in <head> section before <script> tag -
<meta charset="utf-8" />Still no change...
browser address bar - file:///C:/Users/xxxxx/Desktop/grid.html
Here is a SO thread discussing this error.
Do you have other web pages you are building that works? If so use that as a base template and add the Datatables CSS, JS includes and the Javascript code. Debugging your page loading is beyond the scope of this forum. Stack Overflow is a good place for those types of questions.
However if you have Datatables specific issues this is the place to be :-)
Kevin
Ok no problem. Thanks for trying. If I figure it out, I will post the answer here to help others.
That's not going to give the right results. You need to be loading the file from a local web server.
A bit late to the party, but I copied your code above verbatim into a file (fred.html), and this loads correctly and displays the table in both Chrome and FF, so I suspect it's a browser or firewall setting.