多くのテーブル/レコードのリストを扱うWebアプリケーションを構築しています。現在、「AJAX編集インプレイス」機能を構築しているため、同じページでレコードを編集できます。編集ボタン/リンクをクリックすると、テーブルの行がフォームを下にスライドして、レコードを編集できるようになります。
私の質問は、あなたが取ることができるこれらの行動を表示するための最良の方法は何ですか?これはさまざまなアプリケーションでさまざまな方法で行われるのを見てきました。リンク、ボタン、行の上にカーソルを置いたときにのみ表示されるボタン、ボタンの上にカーソルを置くと「ツールチップ」が表示される「ドロップダウン矢印」を編集/削除します。アクションをリンクのリストとして。
これらを表示する最良の方法は何ですか。 (可能であれば)回答を裏付ける記事/研究へのリンクを提供してください。
レコードのテーブル/リストが多数ある場合に最後に必要なことは、永続的なボタン、リンク、またはドロップダウン矢印からのノイズや乱雑さを増やすことで、データを読みにくくすることです。そのため、この例ではホバーアプローチを優先します。
カーソルをホバーに合わせて、視覚的なフィードバックを支援します。ジャンプしたように見えないように、編集されたテキストを関連するセルの内容に揃えます。変更せずにキャンセルするメカニズムを提供してください。
変更されたアイテムを強調表示して元に戻すことができるのは、Niceの追加機能です。
以下は、Pattenry.comの good resource です。多数のjQueryプラグインへのリンクがいくつかあります。
私は 7 Signals がBaseCampHQのその場編集のTo-Doリスト項目で素晴らしい仕事をしたと思います(下の画像にあるように To Doリストチュートリアル を参照) -申し訳ありませんが、実際のコンテンツをぼかす必要がありました...
同様に、私は「スライドオープン」アプローチを支持します。編集のために行を開くときに編集コントロールのみを表示すると、煩雑さが大幅に軽減されます。
次のような解決策を提案できますか?
行をクリックして「展開」すると、エントリがテキストボックスになります(理想的には既にフォーカスされており、「閉じた」レコードとは異なる色で表示されます)。
下にテキストコントロールを配置し、テキストボックスをフラッシュします。どうして?