====== DataTables - The Basic ======
- Download datatables from [[https://datatables.net/download/]]. Here we use the DataTables style.
- jQuery are required for datatables. We use jQuery 2.2.0.
- Link style sheet datatables.min.css in your HTML
- Add the datatables.min.js into your HTML
- Create a in HTML with an id="YOUR_TABLE_ID"
- Add a with $(document).ready(function(){$('#YOUR_TABLE_ID').DataTable();}); tab under your jQuery, and datetables js.
===== Download and Install DataTables=====
Goto [[https://datatables.net/download/]]. The default one is good. Pick download, and download the zip file. Unzip the file. Copy the ''datatables.min.css'', and ''datatable.min.js'' into your project. The ''DataTable-1.1x.xx\images\*.*'' are also needed.
For Grails, copy such directory into the ''assets\images'' directory like:
{{ :datatables:datatable1.png?direct&200 |}}
I know it is ugly, but that's the way it is.
Then, put the css file, and the js file into the ''asserts\stylesheets'' and ''asserts\javascripts'' respectively.
===== The Rest =====
Tables
| Header 1 |
Header 2 |
Header 3 |
| r1 c1 |
r1 c2 |
r1 c3 |
| r2 c1 |
r2 c2 |
r2 c3 |
| r3 c1 |
r3 c2 |
r3 c3 |
{{ :datatables:datatable2.png?direct&600 |}}