Code Monkey home page Code Monkey logo

excellentexport's Introduction

Build Status Rate on Openbase Coverage Status

ExcellentExport.js

Revision history:

3.6.0

3.5.0

  • Add fixValue and fixArray functions to configuration: these configuration functions can be used to manipulate the values of the cells.
  • Update npm dependencies to fix vulnerabilities

3.4.3

  • Update npm dependencies to fix vulnerabilities

3.4.2

  • Remove ES6 function syntax to support IE11
  • Update npm dependencies to fix vulnerabilities

3.4.0

  • Configure TravisCI on GitHub
  • Update npm dependencies to fix vulnerabilities

3.3.0

  • Remove columns by index
  • Filter rows by value
  • Updated build to Webpack 4.x.x

3.2.1

  • Update npm dependencies to fix vulnerabilities

3.2.0

  • Update npm dependencies to fix vulnerabilities

3.1.0

  • Fix old API for base64 and escaping problem.

3.0.0

  • XLSX support. This bumps the build size to 640 KB.
  • New API : ExcellentExport.convert(...)
  • Autogenerate download filename.
  • Data input from arrays or HTML Tables.
  • Multiple sheets for XLS or XLSX formats.

2.1.0

  • Add Webpack build.
  • Create UMD JavaScript module. Library can be loaded as a module (import, RequireJS, AMD, etc...) or standalone as window.ExcelentExport.

2.0.3

  • Fix export as a module.
  • Changed minifier to UglifyJS.

2.0.2

  • Fix CSV Chinese characters and other special characters display error in Windows Excel.
  • Fix URL.createObjectURL(...) on Firefox.

2.0.0

  • Now it can export to big files +2MB.
  • Minimum IE 11.
  • Links open with URL.createObjectURL(...).
  • NPM package available.
  • Using Semantic versioning (2.0.0 instead of 2.0).
  • Module can be loaded standalone or with RequireJS.
  • Change license to MIT.

1.5

  • Possibility to select a CSV delimiter.
  • Bower package available.
  • Compose package available.

1.4

  • Add LICENSE.txt with GPL v3
  • UTF-8 characters fixed.

1.3

  • Added minified version

1.1

  • Added CSV data export

1.0

  • Added Excel data export

Compatibility

  • Firefox
  • Chrome
  • Internet Explorer 11+

Install

npm

npm install excellentexport --save

yarn

yarn add excellentexport

bower

bower install excellentexport

Load

Include script in your HTML:

<script type="text/javascript" src="dist/excellentexport.js"></script>

Include script in your HTML using CDN:

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/excellentexport.min.js"></script>

Require.js

<script src="http://requirejs.org/docs/release/2.3.6/minified/require.js"></script>
<script>
    require(['dist/excellentexport'], function(ee) {
        window.ExcellentExport = ee;
    });
</script>

ES6 import

import ExcellentExport from 'excellentexport';

Usage

<table id="datatable">
    <tr>
        <td>100</td> <td>200</td> <td>300</td>
    </tr>
    <tr>
        <td>400</td> <td>500</td> <td>600</td>
    </tr>
</table>

<a download="somedata.xls" href="#" onclick="return ExcellentExport.excel(this, 'datatable', 'Sheet Name Here');">Export to Excel</a>
<a download="somedata.csv" href="#" onclick="return ExcellentExport.csv(this, 'datatable');">Export to CSV</a>
<!-- new API, xlsx -->
<a download="somedata.xlsx" href="#" onclick="return ExcellentExport.convert({ anchor: this, filename: 'data_123.array', format: 'xlsx'},[{name: 'Sheet Name Here 1', from: {table: 'datatable'}}]);">Export to CSV</a>

API

 ExcellentExport.convert(options, sheets);

 Options:
 {
    anchor: String or HTML Element,
    format: 'xlsx' or 'xls' or 'csv',
    filename: String
 }

 Sheets must be an array of sheet configuration objects. Sheet description:
 [
    {
        name: 'Sheet 1', // Sheet name
        from: {
            table: String/Element, // Table ID or table element
            array: [...] // Array with the data. Array where each element is a row. Every row is an array of the cells.
        },
        removeColumns: [...], // Array of column indexes (from 0)
        filterRowFn: function(row) {return true}, // Function to decide which rows are returned
        fixValue: function(value, row, column) {return fixedValue} // Function to fix values, receiving value, row num, column num
        fixArray: function(array) {return array} // Function to manipulate the whole data array
        ...
    },
    {
        ...
    }, ...
]

fixValue example

This is an example for the fixValue function to handle HTML tags inside a table cell. It transforms BR to line breaks and then strips all the HTML tags.

            fixValue: (value, row, col) => {
                let v = value.replace(/<br>/gi, "\n");
                let strippedString = v.replace(/(<([^>]+)>)/gi, "");
                return strippedString;
            }

Notes

  • IE8 or lower do not support data: url schema.
  • IE9 does not support data: url schema on links.
  • IE10 and above and Edge are supported via the Microsoft-specific msOpenOrSaveBlob method.

Test

python 2.x:
    python -m SimpleHTTPServer 8000

python 3.x:
    python -m http.server 8000

Build

Install dependencies:

npm install

Build development version dist/excellentexport.js

npm run build

Build publish version of dist/excellentexport.js

npm run prod

Publish

npm publish

excellentexport's People

Contributors

jmaister avatar plachance avatar brockfanning avatar dependabot-preview[bot] avatar erunamojazz avatar jehon avatar aureliojargas avatar daedalusdev avatar renovate-bot avatar jacktherock avatar bjarneheden avatar unabashed avatar wucao avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.