First, install the jquery-datatables plugin on your project:
grails install-plugin jquery-datatables
After, download the most reticently DataTables package and copy the following files to your web-app project folder:
css/jquery.dataTables.css images/* js/jquery.dataTables.js
On the views/layouts/main.gsp file, add the following lines:
Within the head tag:
Before the </body> tag:
Finally, add the dataTablesList id on the table tag of your list.gpg file:
If everything goes fine, your default list view will be able as a DataTables component and so, you will have something like that:
Note that both, Grails default list and DataTables plugin have a pagination feature. So, maybe you will want to disable the Grails pagination to let the DataTables do its job by itself. For that, you can pass the counting item number of your domainClass as the max item list value in your action list (on the Controller):
params.max = Math.max(max ?: <your class>.count(), 1)
Remember that this is just a simple example of how to use the DataTables plugin in Grails by getting data directly from DOM. After that, you can do your own customization.
Maybe you want to see:- DataTables examples page;
- Using jQuery DataTables In Grails (with JSON).