To run the basic configuration of the
Context Menu, just set the contextMenu option to
true.From version 0.11, context menu also works for row and
column headers. When the context menu for the row header is
opened, the column options are disabled. Likewise, when the
context menu for the column header is opened, the row
options are disabled
Context Menu With Fully Custom Configuration
For greatest configurability, you use
contextMenu option as a configuration object as described in
jQuery contextMenu documentation.This example shows how to set custom text, how to disable
"Remove row" and "Insert row above" for the first row and
how to add your own option.
Copy-Paste Configuration
Copy and Paste feature are available in
Handson table by default, but only as key shortcuts (Ctrl
(Cmd) + C and Ctrl (Cmd) + V respectively).This plugin makes them available also as a clickable
options in the context menu. Unfortunately, due to the
browser's security restrictions, Handson table is forced to
use a third-party flash-based library. We chose to use
ZeroClipboard - it adds a small invisible flash clip to your
website, allowing the user to click on it, and thus save
data to the clipboard.
Custom Buttons
The alter method can be used if you want to
insert or remove rows and columns using external buttons.
The below example uses the a custom made handson
table.removeRow.js plugin for that matter. Move your mouse
over a row to see it.You can programmatically select a cell using the
selectCell method. The below button implements it.
Comments
With option comments: true, you can add and remove cell
comments through the context menu. To initialize Handson
table with predefined comments, provide comment cell
property: {row: 1, col: 1, comment: "Test comment"}