多対多のフォームをユーザーに提示する最良の方法

Question

ユーザーとの多対多の関係に基づいてフォームを最適に表示する方法について質問があります。モデルを説明して、どのデータを提示する必要があるかを理解できるようにします。

Models and Relationships
   Shipment  has_many :products :through => :shipment_products
   Product   has_many :shipments :through => :shipment_products
   ShipmentProducts belongs_to :shipment,  belongs_to :product

基本的に、船荷証券を作成するために必要なデータを含むA発送フォームがあります。そのフォームに加えて、複数の製品とその数量を選択する必要があります。過去にもドラッグアンドドロップを使用して同様の問題を抱えていましたが、その経験が少し面倒だったので不満でした。この場合、コンテナにリストするにはドラッグアンドドロップできないほど多くの製品があると思います。

したがって、必要なのは、出荷データの入力、製品の検索、製品の選択、数量の追加、および出荷との関連付けを可能にするフォームです。これらのアイテムがエンドユーザーに明確に提示されるようにフォームをデザインする最も効果的な方法は何ですか？

Answer 1

かなりシンプルな形です。非常に基本的なレベルでは、商品ページではなくカート/注文の概要ページから入力されるのはショッピングカートです。したがって、2つの主要なセクションが必要です。製品の検索/追加と、すでに出荷されているすべての概要ビューです。

検索と追加機能は、オートコンプリートスクリプトがそれを監視し、一致を提案するシンプルな自由形式のテキストボックスで最適に実行されます。製品名とSKU（またはシステムにあるその他の識別子）の両方を受け入れる必要があります。

発送の概要セクションは、基本情報（SKUと名前）、数量（オンザフライで変更できる機能）、および追加のアクション（削除など）を表示する単純な表にすることができます。

これは非常に大まかなモックアップです：

^{download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム}