Skip to content
This repository has been archived by the owner on Jul 25, 2021. It is now read-only.
/ TableExport Public archive

The simple, easy-to-implement library to export HTML tables to xlsx, xls, csv, and txt files.

License

Notifications You must be signed in to change notification settings

clarketm/TableExport

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TableExport

The simple, easy-to-implement plugin to export HTML tables to xlsx, xls, csv, and txt files

Getting Started

Download and Setup

To use this plugin, include the jQuery library and the TableExport.js plugin before the closing <body> tag of your HTML document:

<script src="jquery.js"></script>
<script src="tableexport.js"></script>

Install with Bower

$ bower install tableexport.js

Dependencies

Required:

jQuery (1.2.1 or higher)

Optional / Theming:

[Bootstrap] (http://getbootstrap.com/getting-started/#download) (3.1.0 or higher)

Add-Ons:

In order to provide Office Open XML SpreadsheetML Format ( .xlsx ) support, you must include the following third-party scripts to your project before TableExport.js.

<script src="xlsx-core.js"></script>
<script src="filesaver.js"></script>
 ...
<script src="tableexport.js"></script>

To support .xlsx in older browsers ( Firefox < 20, Opera < 15, Safari < 6 ) also include blob.js before the filesaver.js script.

<script src="xlsx-core.js"></script>
<script src="blob.js"></script>
<script src="filesaver.js"></script>
 ...
<script src="tableexport.js"></script>

Usage

CSS

By default, TableExport.js utilizes the [Bootstrap] (http://getbootstrap.com/getting-started/#download) CSS framework to deliver enhanced table and button styling. For non-Bootstrap projects, initialize with the bootstrap property set to false.

$("table").tableExport({
    bootstrap: false
});

When used along with Bootstrap, there are four custom classes .xlsx, .xls, .csv, .txt providing button styling for each of the exportable filetypes.

JavaScript

To use the export plugin, just call:

$("table").tableExport();

Additional properties can be passed in to customize the look and feel of your tables, buttons, and exported data.

Notice that by default, TableExport will create export buttons for three different filetypes xls, csv, txt. You can choose which buttons to generate by setting the formats property to the filetypes of your choice.

/* Defaults */
$("table").tableExport({
    headings: true,                    // (Boolean), display table headings (th elements) in the first row
    formats: ["xls", "csv", "txt"],    // (String[]), filetypes for the export
    fileName: "id",                    // (id, String), filename for the downloaded file
    bootstrap: true,                   // (Boolean), style buttons using bootstrap
    position: "bottom"                 // (top, bottom), position of the caption element relative to table
});

Note: to use the xlsx filetype, you must include the third-party scripts listed in the Dependencies section.

Properties

A table of available properties and their usage can be found here:

Settings

Each button is assigned a default class and default content based on its respective filetype and corresponding css styles.

/* default class, content, and separator for each export type */

/* Excel Open XML spreadsheet (.xlsx) */
$.fn.tableExport.xlsx = {
    defaultClass: "xlsx",
    buttonContent: "Export to xlsx"
};

/* Excel Binary spreadsheet (.xls) */
$.fn.tableExport.xls = {
    defaultClass: "xls",
    buttonContent: "Export to xls",
    separator: "\t"
};

/* Comma Separated Values (.csv) */
$.fn.tableExport.csv = {
    defaultClass: "csv",
    buttonContent: "Export to csv",
    separator: ","
};

/* Plain Text (.txt) */
$.fn.tableExport.txt = {
    defaultClass: "txt",
    buttonContent: "Export to txt",
    separator: "  "
};

Below are additional defaults to support the functionality of the plugin that.

/* default filename if "id" attribute is set and undefined */
$.fn.tableExport.defaultFileName = "myDownload";

/* default class to style buttons when not using bootstrap  */
$.fn.tableExport.defaultButton = "button-default";

/* bootstrap classes used to style and position the export buttons */
$.fn.tableExport.bootstrap = ["btn", "btn-default", "btn-toolbar"];

/* row delimeter used in all filetypes */
$.fn.tableExport.rowDel = "\r\n";

Browser Support

Chrome Firefox IE * Opera Safari
Android * - -
iOS * - - -
Mac OSX -
Windows

*requires third-party dependencies

Live Demo

A live, interactive demo can be found here:

License

TableExport.js is licensed under the terms of the MIT License

Credits