業務システムを開発していると度々持ち上がってくるのがデータグリッドのリッチ化です。様々なソフトウェアがあり、Excel並にリッチなUIを提供するものもありますが、今回はちょっと変わったライブラリを紹介します。 Sensei Gridが提供するのはリッチなフォーカス移動、そしてその場での編集機能になります。これもまた使いどころの多そうな便利なライブラリです。

Sensei Gridの使い方

例えばグリッドがこのように表示されています。

この時、矢印キーでのセル移動はもちろんのこと、タブキーでの横移動、Ctrl + Enterでの下への移動が行えます。まさにExcel的な操作性です。

エンターキーで編集モードです。ドロップダウンのような選択式の表示もサポートされています。

テキストの編集も可能です。

Sensei Gridはマスタメンテナンスのように一覧表の中からデータを探して編集するというのにぴったりです。特に業務に慣れてきた人にとってはキーボード主体での操作の方が速いのでSensei Gridが活躍することでしょう。

Sensei GridはHTML5/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

Sensei Grid datazenit/sensei-grid