Question

I try to init DataTable but can’t.

<style type="text/css" title="currentStyle">
    @import "demo_page.css";
    @import "demo_table.css";
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.dataTables.js"></script>

1. What is wrong?

2. Is structure of table required?

3. Is data required?

<table id="example">    
    <thead>
       <tr>
           <th>Column 1</th>
       </tr>
    </thead>
    <tbody>
        <tr>
            <td>data</td>
        </tr>
    </tbody> 
</table>

Answer 1

You need only two files to initialize:

1. jQuery (however you want to include it); followed by
2. jquery.dataTables.js (or the minified version).

Your table will look crazy without appropriate CSS, (various spans are added to facilitate the sorting icons), but they’re not necessary. They’re just style.

If it’s not initializing with those two files and a $('#myTable').dataTable() call (in the document ready function) then something else is going on and you will need to look at your JavaScript console to see what errors are being thrown.

Here it is in their jsbin environment: http://live.datatables.net/olofeg

No CSS, just the two JS files, a well-formed table, and calling dataTable() from the document ready function.