kintoneスプレッドシートプラグインでExcelライクなUIを試してみよう!
はじめに
kintoneエバンジェリストの村濱です。
これまでの執筆記事の中の「
Handsontableを使ってkintoneをExcelライクに入力しよう その1」は、思ったよりも反応をいただき、Excelライクにkintoneを利用するニーズはあるのだとわかりました。
そこで、今回は上記のカスタマイズをプラグイン化した「kintoneスプレッドシート」をリリースしました。
これで直接JavaScriptを開発せずとも、プラグインをインストールして設定するだけでkintone上でExcelライクな入力が可能になります。
kintoneスプレッドシートのダウンロード
カスタマイズで利用しているHandsontableは、v7.0.0以降MITライセンスではなくなりました。
このカスタマイズでは、
MIT
ライセンスのv6.2.2を利用しています(
ライセンス表記
)。
v7.0.0以降を利用する際は
HandsontableのHP
で有償ライセンスを購入し、ライセンス条件にしたがって利用してください。
詳細は、
Cybozu CDNライセンス対応ガイド
を参照してください。
github上に公開しています。
下記から「plugin.zip」をダウンロードしてください。
このプラグインはプラグイン開発のためのサンプルで、サポート対象外です。
ご理解の上、ダウンロードしてください。
https://github.com/kintone-samples/kintone-spreadsheet/releases
kintoneスプレッドシートのインストール
kintoneのシステム画面から、プラグイン設定画面を開き、「読み込む」をクリックしてプラグインを読み込みます。
kintoneプラグインの追加方法は
kintoneヘルプ
を確認してください。
kintoneスプレッドシートの設定
プラグインをインストールしたら、任意のアプリで利用できます。
今回は「
Handsontableを使ってkintoneをExcelライクに入力しよう その1」と同様のサンプルアプリで試してみます。
カスタマイズビューの設定
スプレッドシート表示のための要素をHTMLで記述します。
カスタマイズビューの作成または編集には、kintoneシステム管理権限が必要です。
|
|
カスタマイズビューについての詳細は次の記事を参照ください。
カスタマイズビューを作成してみよう
アプリからプラグインの設定をする
アプリの設定画面から、プラグインを設定します。
アプリ設定画面を開いて、「設定」>「プラグイン」からプラグイン設定画面を開きます。
プラグイン設定画面にて「プラグインの追加」を押して、「kintoneスプレッドシート」を追加してください。
追加したあとは、次の歯車マークからプラグインの設定が行えます。
プラグイン設定画面を開き、カスタマイズビューで設定した要素IDと、スプレッドシートに表示したいフィールドを選択して、保存してください。
「2.1で設定した要素IDを入力してください」には入力例が表示されています。
設定した要素IDを必ず入力してください。
これで設定は完了です。
kintoneスプレッドシートの使い方
設定したスプレッドシート用の一覧を開くと、スプレッドシートが表示されます。
一覧上で追加、編集、削除ができます。
注意点
まだ、プルダウンやラジオボタンには対応していないので(フリーテキスト入力)、使いやすくなるよう開発は続けていきます。
今回はベータ版の提供となり、他にも足りない機能などはあるかもしれませんが、了承のうえ利用してください。
制限事項
こちらのプラグインは、ゲストスペースでは使用できません。
最後に
いかがでしたでしょうか。
よく、kintoneを利用している現場でも、Excelのように一括入力や削除をしたいという声を聞きます。
このプラグインはそのような要望を簡単に実現できますので、ぜひお試しください。
また、不具合や改善要望などはGithubの
Issue
からご連絡ください。
ソースはGithubに公開しているので、forkして拡張するのも自由ですし、Pull Requestをいただけるとうれしいです。