Datatable jQuery plugin example
This is an example using the Datatable jQuery plugin. This example shows record in a table with paging and search.
- Access and work the exampleAccess and work the example
- Install script
- Testing automation
In order to access this example, please access the url below or "jQuery DataTable UI" link from the top page.
Then the page below will appear.
You can do next operations.
- Set number of records shown in this table, by selecting "Show entries"
- Search fulltext search by inputing word into the "Search" text box
- Paging by Next and Previous
This example is how to use one of the data table jQuery plugin.
The source code is in the "ALINOUS_HOME/samples/gridtable/" folder.
At first, put the html code to apply JQuery datatable plugin.
In this code, by surrounding with div tag, set the width of datatable widget. And set header and footer in this table.
The tbody section is blank. The record will be loaded later.
In this script, set the url to get Json data into "/samples/gridtable/serverData.alns".
The source code to get JSon data of records is below.
In this script, it supports
- Paging of the record
- Full text search
The parameter "$IN.iDisplayStart" indicate the start position of the database record, and "$IN.iDisplayLength" does the limit of records in a page.
The "$IN.sSearch" is inputed word for full text search.
This example uses database table, so you have to setup it, if you manually do. The install script is at "/install/install.alns".
The source code of the install script is below.
This script makes "ajax" table and insert demo data.
This example is testable code, there is more example to do testing automation. Please take a look at Testing Datatable example.