web-dev-qa-db-ja.com

フォームの質問に対する異なる回答を交換して、両方の結果を表示できるようにする

ウィザードの1つのステップで、ユーザーがオプションを選択する必要があるサイトがあります。彼らがこの選択を行ったら、フォームフィールドと結果の情報はその応答に固有です。ただしこれは固定の選択ではないので、2つを切り替えてどちらを好むかを確認できます

応答フォームと情報の両方のセットを一度に表示する代わりに、選択した回答に関連するもののみを表示するのは理にかなっています。 (各応答にはかなり多くの情報が含まれています)ここでどちらの方法が適していますか?

ユーザーがタブを簡単に切り替えることができるように、2組のフォームをタブの後ろに配置することを計画していますが、最初にタブパネルを表示すると、開いているタブが閉じたタブよりも目立つようになるのではないかと心配しています。 。 どのオプションを選択するかをユーザーが自由に選択できるようにします。

また、各オプションの意味に対する簡単な説明も必要です。

私が検討しているオプションは2つあると思います。最初に、この状態と他の状態に関する情報を含む状態の1つでタブパネルを開くには(タブに気付かない場合は交換するオプションを使用):

enter image description here

また、2つのオプションを、選択する説明が付いたボタンのペアとして提示するという別のアイデアもあります。このオプションを選択すると、必要な状態でタブパネルが開きます。ただし、これを行うと、一度決定したら変更できるかどうかがはっきりしないので、説明テキストとパネル内の他のタブへのリンクを複製しました。これは非常に長い乱雑なページになり、それは私がそもそも避けようとしていることの1つです(ここで、赤い線の下のコンテンツは、質問が回答されるまで表示されません)。

enter image description here

このような問題は他のサイトでも発生していると思いますが、どのように処理されたかの例を見つけることはできません。 私が行ったこれらのルートのうち、(もしあれば)どちらが望ましいですか?なぜですか?

/ EDIT-ここでは例として純粋に自動車のトランスミッションを使用していることを述べておきます。これは私のアプリケーションの実際の目的ではありませんが、特定の問題の良い例を提供します。

3
JonW

これはデスクトップアプローチでは多すぎるかもしれませんが、私は次のようにします。

  • 手動と自動の選択をラジオボタンとして提示する必要があります。
  • 送信タイプに固有のオプションは、対応するラジオボタンの下に表示されます。選択したラジオボタンに基づいて、対応するオプションが有効になり、その他のオプションは無効になります。

例:

enter image description here

次の理由により、これは非常に単純に見えます。

  • 「自動切り替え」リンクを削除できます
  • タブを削除できます
2
Bart Gijssens