DataTable Utilities - Documentation
DataTable Utilities, includes Data Manipulation Classes for emails, Urls and Money. Also Includes Datatable Footer Totals.
Having this plugin intergrated will make the transition to Canada.ca easier as these features are already in use on https://www.tpsgc-pwgsc.gc.ca, currently some of the pages that make use of this plugin and other pages that make use of Other Javascripts are just pointed to from Canada.ca
The Public at Large, the plugin makes DataTables more user friendly with Clickable Links, and they are used to this functionality our PRE Canada.ca Pages.
GCWeb implementation plan
- 2024-09-24 00:00:00 +0000 - Initial Development Completed
- 2024-10-01 00:00:00 +0000 - Get Intial Feedback from Wet-Boew Team Before Pull Request Completed
- 2024-10-08 00:00:00 +0000 - Fix Issue Identified by Wet-Boew Team Completed
- 2024-10-12 00:00:00 +0000 - Get French Sample page Translated Completed
- 2024-10-15 00:00:00 +0000 - Get Pages throuh our QC cycle and our WACR Team Completed
- 2024-10-22 00:00:00 +0000 - Fix Identified problems and accesibility issues Completed
- 2024-10-24 00:00:00 +0000 - Submit Pull Request Completed
- 2025-11-30 00:00:00 +0000 - Produce accessibility conformance report Todo
- 2025-06-30 00:00:00 +0000 - Work toward a provisional plugin In Progress
Todo and for future consideration
- Add Other Data Manipulation Classes Maybe (percentage)?
Sponsor: PSPC - Steve Bourgeois (steve.bourgeois@tpsgc-pwgsc.gc.ca)
Working examples
Configuration options
Enable the plugin for the targeted table by adding the CSS class wb-tables-utility to the table. Add the attribute data-wb-tables-utility to configure the options.
| Option | Description | How to configure | Values |
|---|---|---|---|
| debug | Print Debug messages to the console | data-wb-tables-utility="{"debug":true}" |
|
| filteredsum | Column Totals to reflect Filtered DataTable Data | data-wb-tables-utility="{"filteredsum":false}" |
|
| wb-col-sum | When this class is applied to a column, a column footer total is calculated | "columnDefs": [{ "className": "wb-col-sum", "targets": [3]}] |
wb-col-sum |
| wb-col-money | When this class is applied to a column, the data is manipulated to reflect currency with $ | "columnDefs": [{ "className": "wb-col-money", "targets": [3]}] |
wb-col-money |
| wb-col-cur-thousand | When this class is applied to a column, the data is manipulated to reflect currency without $ | "columnDefs": [{ "className": "wb-col-cur-thousand", "targets": [3]}] |
wb-col-cur-thousand |
| wb-col-mailto | When this class is applied to a column, the data is searched with an email partern, and when found are wrapped with <a href="mailto:...">...</a> to make it a clikcable link. | "columnDefs": [{ "className": "wb-col-mailto", "targets": [3]}] |
wb-col-mailto |
| wb-col-url | When this class is applied to a column, dataTable Utilites looks for a second column with the same name as this column that is ending with -url and the 2 are stiched into a single column wrapped with <a href="column-name-url">column-name</a> to make it a clikcable link. | "columnDefs": [{ "className": "wb-col-url", "targets": [3]}] |
wb-col-url |
Page details
- Date modified: