DataTableView Web Component

GitLab Repository

Usage

<vpu-data-table-view></vpu-data-table-view>

Attributes

• lang (optional, default: de): set to de or en for German or English
  • example <vpu-data-table-view lang="de"></vpu-data-table-view>
• paging (optional, required to let datatable do the paging of loaded rows)
  • example <vpu-data-table-view paging></vpu-data-table-view>
• searching (optional, required if a search box is desired)
  • example <vpu-data-table-view searching></vpu-data-table-view>
• exportable (optional): set to display export buttons
  • example <vpu-data-table-view exportable></pu-data-table-view>
• export-name (optional, default: 'Data Export'): add name for download file (without extension)
  • example <vpu-data-table-view exportable export-name="All Items"></pu-data-table-view>
• column-searching (optional, default: false): add search fields for every column
  • example <vpu-data-table-view column-searching></pu-data-table-view>
• default-order (optional, default: [ ]): set the default order as column and direction
  • example <vpu-data-table-view default-order='[1,"asc"]'></pu-data-table-view>
  • example <vpu-data-table-view default-order='[[0,"desc"],[2,"asc"]]'></pu-data-table-view>

Local development

# get the source
git clone git@gitlab.tugraz.at:VPU/WebComponents/DataTableView.git
cd DataTableView
git submodule update --init

# install dependencies (make sure you have npm version 4+ installed, so symlinks to the git submodules are created automatically)
npm install

# constantly build dist/bundle.js and run a local web-server on port 8003
npm run watch-local

Jump to http://localhost:8003 and you should get a demo page.