- CSV
- Excel
- SQL (not added to the inline demo below)
Additional buttons are supported to:
- Print a data table
- Copy a data table to the clipboard
- Toggle the visibility of specific columns (not added to the inline demo below)
Inline demo #
| ID | Gender | Date Of Birth | Firstname | Lastname | Address | Zipcode | City | County | Country | Phone No | Registration Date | |
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| ID | Gender | Date Of Birth | Firstname | Lastname | Address | Zipcode | City | County | Country | Phone No | Registration Date |
Extension Manager #
Adding buttons manually #
Adding buttons manually gives us more control. Buttons can be added through advanced settings. Here is an example which adds the Excel, CSV and PDF export buttons to a data table.
{
"dom": "Blfrtip",
"wpda_buttons": "CEF"
}- Adds export to CSV, Excel and PDF buttons to a data table
- Options dom and wpda_buttons must be added to column table options advanced
- Make sure column table options advanced contains valid JSON
Explanation #
- The B in { “dom”: “Blfrtip” } adds the buttons extension to the data table (case sensitive)
- Characters CEF in { “wpda_buttons”: “CEF” } will add the standard buttons CSV, Excel and PDF (case insensitive)
- Buttons are shown in the order they appear in option wpda_buttons
Supported standard button types and their abbreviations #
C = Export to CSV
E = Export to Excel
F = Export to PDF
P = Print
Y = Copy to clipboard
S = Export to SQL
V = Toggle column visibility – list
T = Toggle column visibility – buttons
Adding row selection #
The previous example of export buttons will export all visible rows. Use option “select” to allow users to select specific rows to be exported:
{
"select": {
"selector": "td:not(.dtr-control)",
"style": "multi"
}
}This option allows users to select rows. The row selection will be reflected in the export, print and copy actions.
Adding column selection #
Column selection is available from a list button or a toggle button per column. Use option wpda_buttons to add column selection.
Add button to toggle columns from a list #
{
"dom": "Bfrtip",
"wpda_buttons": "V"
}Add a button for each column #
{
"dom": "Bfrtip",
"wpda_buttons": "T"
}Notes #
- This option requires that the button extension is loaded (needs: “dom”: “Bfrtip”)
- Toggle column visibility does not work when search and list boxes are added to the table header
- Toggle column visibility is not reflected in SQL exports
