Installation

The Handsontable for WireBootstrap library is located in wire-handsontable.js. This and other other related files can be installed from the NPM package registry at@wirebootstrap/wire-handsontable.

npm install @wirebootstrap/wire-handsontable

Note: Handsontable for WireBootstrap does not include a license for Handsontable. A license for Handsontable may need to be purchased separately depending on your usage. Visit, Handsontable pricing for more details.

Handsontable for WireBootstrap will load the Hansontable JavaScript library and style sheet from the following locations if not found on the page.

https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.jscdn.jsdelivr.net

https://cdn.jsdelivr.net/npm/handsontable/dist/handsontable.full.min.css

Class

Handsontable for WireBootstrap extends the wire.ui.component class. As such, it inherits all the base functionality of that class.

To create a new instance of the Handsontable for WireBootstrap component, use the wire.handsontable class.

const table = new wire.handsontable();

Render

Render the component using an HTML div element.

JavaScript

<div id="table"></div>

new wire.handsontable().render("#table");

React

<WireComponent component="wire.handsontable">
    <div></div>
</WireComponent>

Angular

<div wire-component="wire.handsontable"></div>

Sample Project

The NPM package includes a sample project that demonstrates the features of Handsontable for WireBootstrap.

Handsontable for WireBootstrap Sample Application

After installing, open the project in any web project editor. Next, open a terminal window and run the npm first script when running the project for the first time. This will install the npm packages required to run the project and then open the default page in a new browser window.

npm run first

Use npm start to run the project later now that the packages are installed.

npm run start