【Handsontable】contextMenu コンテキストメニュー コピー&ペースト
コンテキストメニュー
Handsontable(ハンズオンテーブル)では、コンテキストメニューに標準でコピーとペースト(貼付け)のコマンドがない。 はしくれSEとしては、Ctrl+C、Ctrl+Vで問題ないが、以外にショートカットを知らない人もいる。 なので、はしくれSEとしてはコンテキストメニューにコピーとペースト(貼付け)のコマンドを用意してあげたい。
※コンテキストメニューとは
マウスの右クリックなどで表示されるメニューのことです。
以下のようなものを作ってみました。
たぶん、そのままコピペで動くと思います。
$(function(){ var data = [ ["", "Ford", "Tesla", "Toyota", "Honda"], ["2017", 10, 11, 12, 13], ["2018", 20, 11, 14, 13], ["2019", 30, 15, 12, 13] ]; var container = document.getElementById('example'); var clipboardCache = ""; var hot = new Handsontable(container, { data: data, // コンテキストメニューの使用 contextMenu: true, // コンテキストメニューの定義 contextMenu: { items: { 'copy': { name: 'コピー', }, 'paste': { name: '貼り付け', disabled: function() { return clipboardCache.length === 0; }, callback: function() { var plugin = this.getPlugin('copyPaste'); this.listen(); plugin.paste(clipboardCache); return true; } }, } }, afterCopy: function(changes) { clipboardCache = stringify(changes); }, }); }); /** * handsontable用にペーストできるよう * コピーデータを加工 */ function stringify(arr) { var r, rLen, c, cLen, str = '', val; for (r = 0, rLen = arr.length; r < rLen; r += 1) { cLen = arr[r].length; for (c = 0; c < cLen; c += 1) { if (c > 0) { str += '\t'; } val = arr[r][c]; if (typeof val === 'string') { if (val.indexOf('\n') > -1) { str += '"' + val.replace(/"/g, '""') + '"'; }else { str += val; } }else if (val === null || val === void 0) { // void 0 resolves to undefined str += ''; }else { str += val; } } if (r !== rLen - 1) { str += '\n'; } } return str; }