ラジオボタングループ内のドロップダウンまたはその他の入力

Aug 21 2020

基本的には巨大なアンケートのようなアプリケーションの開発を引き継ぎました。いくつかのデザインの選択により、いくつかの無効なHTMLが発生しましたが、これを修正しようとしています。主なものは、ドロップダウンがラジオボタンに関連付けられている場所です。このドロップダウン(入力の選択)は<label>、ラジオ入力と同じ内部にネストされています。これを修正しようとしているときに、これを表示するためのより良い方法があるのではないかと思っていました。現在のUIの例を次に示します。

選択して1次のオプションのを:

  • ラジオ1-値の多いドロップダウン
  • ラジオ2
  • ラジオ3
  • ラジオ4

スライダーを使用した例を次に示します。

健康上の問題はどのくらいありますか:

  • 健康上の問題はありません
  • 0〜200か月-スライダー入力
  • 200ヶ月以上
  • わからない
  • 関係ありません

Radio-1は20以上の値を持つことができます。選択できるオプションは1つだけなので、ラジオボタンスタイルの質問です。オプション2〜4は無関係であり、そこで迷子になるため、ドロップダウン内にオプション2〜4を入れることはできません。Radio-1の代替選択肢ではなく、代替オプションとしてユーザーに表示される必要があります。これが理にかなっていることを願っています!

このような状況で私に指摘できるデザインパターンやリソースはありますか?

どんな助けでも大歓迎です!

回答

AdamSilver Aug 22 2020 at 06:24

ユーザーがラジオボタンを選択すると、他のフォームコントロールが表示されます。

補足:スライダーや選択ボックスは避けてください。使いにくいです。

2 dan00binator Aug 21 2020 at 14:30

古典的なプログレッシブ開示の相互作用の機会のように聞こえます。

最初から、ユーザーにラジオボタンごとに1つずつ、合計4つの簡単なフレーズが表示されると想像してください。

まだドロップダウンリストを表示しないでください。

ユーザーが一番上のラジオボタン(多くの基本的なオプションがあるボタン)を選択すると、その時点でのみ、インターフェイスに新しい条件付きフィールドが表示されます(条件は次のとおりです:ラジオボタンが選択されています)。