ugnagブログ

たいした内容はありません。思いつきで書いているだけ。
開発日記がメインかな。

<< すごいぞG-mail | main | 無線LANルータもらった >>

JSツール[直接編集テーブル]

スクロール対応テーブルのついでに、違うテーブルも作った。
テーブルの中にフォームを入れ、テーブル内で直接編集をするような画面が欲しいと思ったことはないでしょうか。

今回、そのようなテーブルを作成するためのツールを作りました。

テーブル自体は、このツールで構築します。

同一のドキュメント内に複数のテーブルも作成できます。



内容の変更に対して、コールバックイベントが発生し、通知します。
その際、イベントは項目ごとに発生するのではなく、行ごとに発生します。
例えば、
 1. 3行目2項目を修正
 2. 項目移動(イベントは発生しない)
 3. 3行目3項目を修正
 4. 項目移動(イベントが発生)
 5. 4行目1項目を修正
となります。

各項目間の移動は、エンターキーでも可能にしてあります。
また、上下キーで行の移動も可能です。



行はマウスによって入れ替えが可能です。
入れ替えをした際、イベントが発生し、通知します。
コールバック内で、順番が入れ替わった範囲を取得することも可能です。


各項目は、テキストボックスだけではなく、ラジオボタン、プルダウンなども指定でき、状態変更の際に背景色を変化させることもできます。


使い道としては、参照用マスターデータ(商品マスター等)の変更に使えると思います。

修正イベントやソートイベントの中で、非同期通信を行って、
サーバーに連絡をすればいいかと。


と、まあ、とりあえずこんなところ。
プログラム・開発(その他開発) | comments (0) | -

Comments

Comment Form

本文に書いて下さい
本文にh抜きで書いて下さい