Table Types

There are six ways to populate your table with data. You can use this page to learn the differences and decide which option is best in your situation. Follow the links to the respective options for further information. If you're in a hurry, I suggest you try option 5 first. You can always switch if you need to.

1. Inline Data

You can add your data directly to your GSP in HTML:

<dt:datatable name="localAuthorsInline">
    <dt:column name="firstName" title="Hello!"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
    <dt:column name="dateOfBirth" type="date"/>
    <tr>
        <td>Bob</td>
        <td>Smith</td>
        <td>bob.smith@nowhere.com</td>
        <td>09/05/1970</td>
    </tr>
    <tr>
        <td>Mary</td>
        <td>Jackson</td>
        <td>mary.jackson@nowhere.com</td>
        <td>07/04/1980</td>
    </tr>
</dt:datatable>

• When your data is static.
• When your data does not exist within a set of objects with common properties.
• When the volume of data is not so large that it would overwhelm your GSP.

Even when one of the above scenarios exists, it might be easier to instead use the Data Items option (see below) and put the data for each row into a Map in your page controller.

2. Data Items

You can create a list of objects in your GSP's controller and reference that to provide your data. This is achieved using the dataItems table option:

<dt:datatable name="localAuthors" dataItems="${listOfAuthors}">
    <dt:column name="firstName"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
</dt:datatable>

This option may be suitable in the following cases:

• When you want all the data loaded at the same time as your GSP.
• When the volume of data is not so large that it would overwhelm your GSP.
• When you want searching and sorting to be performed within the browser.

3. Server Data Load Using Built-In Controller

You can set the table to obtain its data from the server when the table is initialized. In this case, the table will obtain its entire data set for all rows via a single AJAX request. This is achieved by setting the serverDataLoad option to true:

<dt:datatable name="serverDataLoadAuthors" domainClass="datatablestest.Author" serverDataLoad="true">
    <dt:column name="firstName"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
</dt:datatable>

This option may be suitable in the following cases:

• When the volume of data is small enough that it will not take too long to download to the browser.
• When you want searching and sorting to be performed within the browser.

4. Server Data Load Using Custom Controller

This is similar to option 3, only you use your own controller to supply the data.

<dt:datatable name="serverDataLoadAuthors" domainClass="datatablestest.Author" serverDataLoad="true" controller="myTable" dataAction="myDataAction">
    <dt:column name="firstName"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
</dt:datatable>

This option may be suitable in the following cases:

• When the volume of data is small enough that it will not take too long to download to the browser.
• When you want searching and sorting to be performed within the browser.
• You have specific needs that the plugin is not capable of meeting.

Note that when using any of the options that do not use server-side processing, you may wish to set deferRender to true in order to shorten the initialization time.

5. Server-Side Processing Using Built-In Controller

You can set the table to obtain its data from the server via AJAX, one page at a time. In this case, the browser will only store one page of data at a time, and any searching and sorting will be performed on the server by the plugin.

This is achieved by setting the serverSide option to true:

<dt:datatable name="serverSideAuthors" domainClass="datatablestest.Author" serverSide="true">
    <dt:column name="firstName"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
</dt:datatable>

This option may be suitable in the following cases:

• When the volume of data is large enough that it would take too long to download the entire table to the browser.
• When you wish to minimize the amount of data being downloaded.

6. Server-Side Processing Using Custom Controller

This is similar to option 5, only you use your own controller to supply the data.

<dt:datatable name="serverSideAuthors" domainClass="datatablestest.Author" serverSide="true" controller="myTable" dataAction="myDataAction">
    <dt:column name="firstName"/>
    <dt:column name="lastName"/>
    <dt:column name="email"/>
</dt:datatable>

This option may be suitable in the following cases:

• When the volume of data is large enough that it would take too long to download the entire table to the browser.
• You have specific needs that the plugin is not capable of meeting.

See Also

dataItems, serverSide, serverDataLoad, dataAction, controller

Back to Home.