Installation Problem

ebtalk · January 2016

This is my first time with Datatables and i'm trying to do a test run with it.

I'm trying to do the zero installation option found here:
http://datatables.net/examples/basic_init/zero_configuration.html

as a test on my site. When I copy over the javascript, html and css on my site, the table comes up as a regular table with nothing on it.

Could anybody tell me what I'm doing wrong?

ebtalk · January 2016

Here's my code:


<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>

<script>
$(document).ready( function () {
    $('#table_id').DataTable();
} );
</script>


</head>

<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css">
   
<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
  
<body>

<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>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>
    </table>

</body>

</html>

crush123 · January 2016

your datatable reference does not refer to the table div and it is before the jquery declaration

try replacing the top of your code with this...

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.10/css/jquery.dataTables.min.css">

<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script> 
<script>
$(document).ready( function () {
$('#example').DataTable();
} );
</script>
</head>

Installation Problem

Installation Problem

Answers

Howdy, Stranger!

Categories

DataTables

Installation Problem

Installation Problem

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables