"ARI Smart Content - Data Table" plugin converts HTML tables to advanced tables with progressive interaction controls.. The plugin can be enabled/disabled and configured on "Extensions → Plugin Manager" page on Joomla! backend. Common information how to use "ARI Smart Content" applications plugins is here. {datatable} plugin tag is used for the plugin. The following code converts a simple HTML table to a datatable:

{datatable}

       <table>

               <thead>

                       <tr>

                               <th>Column 1</th>

                               <th>Column 2</th>

                               <th>Column 3</th>

                       </tr>

               </thead>

               <tbody>

                       <tr>

                               <td>Value 1-1</td>

                               <td>Value 1-2</td>

                               <td>Value 1-3</td>

                       </tr>

                       <tr>

                               <td>Value 2-1</td>

                               <td>Value 2-2</td>

                               <td>Value 2-3</td>

                       </tr>

                       <tr>

                               <td>Value 3-1</td>

                               <td>Value 3-2</td>

                               <td>Value 3-3</td>

                       </tr>

               </tbody>

       </table>

{/datatable}

It is also possible to use the following code:

{datatable}

       <table>

               <tr>

               <td>Column 1</td>

               <td>Column 2</td>

               <td>Column 3</td>

       </tr>

               <tr>

                       <td>Value 1-1</td>

                       <td>Value 1-2</td>

                       <td>Value 1-3</td>

               </tr>

               <tr>

                       <td>Value 2-1</td>

                       <td>Value 2-2</td>

                       <td>Value 2-3</td>

               </tr>

               <tr>

                       <td>Value 3-1</td>

                       <td>Value 3-2</td>

                       <td>Value 3-3</td>

               </tr>

       </table>

{/datatable}

Wrap a HTML table with {datatable} and {/datatable} tags.

Plugin settings

The following parameters can be defined on plugin settings page ("Extensions → Plugin Manager → ARI Smart Content - Data Table" page on Joomla! backend):

• Load method is used to specify load method on client side. If it is set to 'On Load', the datatable will be created when page and all resources (images, styles and etc.) are loaded by a browser. If it is set to 'DOM Ready', the datatable will be created immediately when page is loaded (it doesn't wait till all resources are loaded, they will be loaded in parallel). In other words, 'DOM Ready' event occurs before 'On Load' and if possible it is preferable to use it instead of 'On Load'.  This parameter can be useful to resolve conflict with some 3rd party extensions, if the extension doesn't work properly when it's set to 'DOM Ready', try to switch it to 'On Load'.

• Theme is used to select a theme.

• Loading pane if this option is enabled, loading icon will be shown till data are loaded.

• Loading message is used to specify text which will be shown when data are loaded.

• Scroll Height if you want to add vertical scrolling to the table set height of visible area in pixels, otherwise leave this parameter empty. Possible values: 250, 400 and etc.

• Scroll Width if you want to add horizontal scrolling to the table set width of visible area in pixels, otherwise leave this parameter empty. Possible values: 430, 600 and etc.

• Save state is used to enable/disable state saving. When it is enabled a cookie will be used to save table display information such as pagination information, display length, filtering and sorting. As such when the end user reloads the page the display display will match what thy had previously set up.

• Duration of cookie is duration of the cookie which is used for storing session information. This value is given in seconds.

• Filter is used to enable/disable ability to filter data (enter a search string in a textbox).

• Default search string is used to specify a default search string which will be used to filter data.

• Sorting is used to enable/disable sorting of columns.

• Show export buttons if this parameter is set to 'Yes' then 'Copy', 'CSV', 'Excel', 'PDF' and 'Print' buttons will be shown about the table. Export feature is working correctly for data with English characters.

"Paging settings" parameters section is used to configure paging:

• Using paging is used to enable/disable pagination.

• Pagination type is used to select pagination type.

• Paging list is used to show/hide drop-down where page size (number of records which will be shown per page) can be selected.

• Number of rows to display is number of rows to display on a single page when using pagination.

• Choose custom paging mode is used to specify paging parameters. The following modes are supported:

• Simple is used to define page size for page size drop-down. Defined page sizes will be also shown the drop-down. The following parameters are supported for this mode:

• Custom pagination is used to specify page sizes separated by commas. For example: 1,5,10,25,50,100

• Advanced is used to define page sizes and labels for them which will be shown in page size drop-down. If label is not defined then page size value will be shown into the drop-down. The following parameters are supported for this mode:

• Page size is used to define page size option.

• Label is a label which will be shown into page size drop-down.

"Fixed columns" parameters section is used to configure fixed columns. These columns will be frozen and not scrollable. It is useful if scrolling table is used and you want to not scroll some important column(s). The following parameters are available:

• Fixed left columns  is used to specify number of columns which will be frozen from left side. Possible values: 0, 1, 3 and etc.

• Width of left columns is used to specify width which will be reserved for fixed left columns. Possible values: 150, 220 and etc.

• Fixed right columns  is used to specify number of columns which will be frozen from eight side. Possible values: 0, 1, 3 and etc.

• Width of left columns is used to specify width which will be reserved for fixed rght columns. Possible values: 150, 220 and etc.

"Additional settings" is used to specify some additional parameters for datatable. The following parameters are supported:

• Table information is used to enable/disable the table information display. This shows information about the data that is currently visible on the page, including information about filtered data if that action is being performed.

• Show processing is used to enable/disable the display of a 'processing' indicator when the table is being processed (e.g. a sort). This is particularly useful for tables with large amounts of data where it can take a noticeable amount of time to sort the entries.

• Processing label is text which is displayed when the table is processing a user action (usually a sort command or similar).

• Auto width is used to enable/disable automatic column width calculation.

• Row CSS classes is an array of CSS classes that should be applied to displayed rows. This array may be of any length, and DataTables will apply each class sequentially, looping when required.

• Length menu label detail the action that will be taken when the drop down menu for the pagination length option is changed. The _MENU_ variable is replaced with a default select list of 10, 25, 50 and 100.

• Zero records label is text which is shown inside the table records when the is no information to be displayed. This includes when the table is filtered to zero records.

• Info label this string gives information to the end user about the information that is current on display on the page. The _START_, _END_ and _TOTAL_ variables are all dynamically replaced as the table display updates, and can be freely moved or removed as the language requirements change.

• Info empty label display information string for when the table is empty.

• Info filtered label when a user filters the information in a table, this string is appended to the information (sInfo) to give an idea of how strong the filtering is. The variable _MAX_ is dynamically updated.

• Info postfix label if can be useful to append extra information to the info string at times, and this variable does exactly that. This information will be appended to the information at all times.

• Search label details the actions that will be taken when the user types into the filtering input text box.

• First label is string which will be used as a label for "first page" link.

• Previous label is string which will be used as a label for "previous page" link.

• Next label is string which will be used as a label for "next page" link.

• Last label is string which will be used as a label for "last page" link.

Plugin code syntax

The following attributes can be used for {datatable} tag:

• theme is used to override Theme parameter from plugin settings. The following sample code set advanced theme for the slider:

{datatable theme="lefrog"}

       ... a HTML table goes here ...

{/datatable}

• loadingPane is used to override Show loading pane parameter from plugin settings. Possible values: 0 and 1. The following code enable loading pane:

{datatable loadingPane="1"}

       ... a HTML table goes here ...

{/datatable}

• loadingText is used to override Loading message parameter from plugin settings.

• scrollHeight is used to override Scroll Height parameter from plugin settings. Possible values: 300, 420 and etc.

• scrollWidth is used to override Scroll Width parameter from plugin settings. Possible values: 635, 800 and etc.

• saveState is used to override Save state parameter from plugin settings. Possible values: 0 and 1.

• cookieDuration is used to override Duration of cookie parameter from plugin settings. Possible values: 0, 7200 and etc.

• useFilter is used to override Filter parameter from plugin settings. Possible values: 0 and 1.

• searchText is used to override Default search string parameter from plugin settings.

• sort is used to override Sorting parameter from plugin settings. Possible values: 0 and 1.

• showExportButtons is used to override Show export buttons parameter from plugin settings. Possible values: 0 and 1.

• paginate is used to override Using paging parameter from plugin settings. Possible values: 0 and 1.

• paginationType is used to override Paging type parameter from plugin settings. Possible values: two_button or full_numbers.

• lengthChange is used to override Paging list parameter from plugin settings. Possible values: 0 and 1.

• pageSize is used to override Number of rows to display parameter from plugin settings. Possible values: 5, 10 and etc.

• fixedLeftColumns is used to override Fixed left columns parameter from plugin settings. Possible values: 0, 1, 2 and etc.

• fixedLeftColumnsWidth is used to override Width of left columns parameter from plugin settings. Possible values: 100, 175 and etc.

• fixedRightColumns is used to override Fixed right columns parameter from plugin settings. Possible values: 0, 1, 2 and etc.

• fixedRightColumnsWidth is used to override Width of right columns parameter from plugin settings. Possible values: 100, 175 and etc.

• showInfo is used to override Table information parameter from plugin settings. Possible values: 0 and 1.

• showProcessing is used to override Show processing parameter from plugin settings. Possible values: 0 and 1.

• autoWidth is used to override Auto width parameter from plugin settings. Possible values: 0 and 1.

• stripClasses is used to override Row CSS classes parameter from plugin settings.