web-dev-qa-db-ja.com

サインアップ時にユーザーがすべての必須フィールドに入力するようにする方法

Webサイトの登録フォームで、必要なすべてのフィールドに入力するまでユーザーが続行できないようにする最良の方法は何ですか?たとえば、ユーザー名、パスワードなどが入力されるまで[送信]ボタンをグレー表示にする必要がありますか?ちなみに、ユーザーがパスワードを選択するフィールドの横に入力すると、それが受け入れを示します。「短すぎる」「良い」「パスワードが一致しない」など(一部のユーザーは、ユーザーに自分のパスワードですが、私はこれを決めました。

3
Celeritas

私は実際にフォームが「送信可能」になるまで送信ボタンを無効にするという考えをサポートしていますが、その動作自体は問題のあるフィールドを示していません。

アスタリスクは、どのフィールドが必須であるかを示す良い指標ですが、フィールドにエラーがあるかどうかや、エラーの種類はわかりません。

つまり、要するに:

  1. 必須フィールドにインジケーターを使用
  2. インスタントフィードバックを使用して、フィールド入力が間違っているかどうか(非論理的、範囲外など)を確認します。
  3. 一部のフィールドには、対応する必要がある論理関係(つまり、A = Xの場合、BをYにすることはできない)があり、それらのインスタンスで適切なフィードバックを提供する方法を見つけることができることに注意してください。
  4. フォームが送信できる状態になるまで、送信ボタンを無効にします。次に、送信時に再度無効にして(または他の方法で変更して)、アクションに関する視覚的なフィードバックを提供します。
  5. 何を選択しても、一貫性があります。
5
CB Du Rietz

私は、必須フィールドの横に赤いアスタリスクを付け、アスタリスクにカーソルを合わせるとポップアップで説明が表示されるのが好きです。

有効なエントリを入力せずにユーザーがフォーカスし、そのフィールドからぼかした場合、フィールドを赤で囲んで表示することも役立ちます。

0
beth

送信ボタンをグレー表示にすると、ユーザーは混乱するでしょう。標準に従って、ユーザーにとって簡単にします。必須フィールドまたはアウトラインの横にある小さなアスタリスクだけで、これらが必須フィールドであることをユーザーに知らせるのに十分です。優れた設計パターンは、ユーザーがフィールドに入力した直後に即座にフィードバックを提供することです。

http://alittlecode.com/files/jQuery-Validate-Demo/

0
Adnan Khan

必須フィールドとオプションフィールドの両方がある場合、どのフィールドが何であるかをユーザーに明らかにする必要があります。

「required」または「req」が付いた単純なタグまたはバッジは、おそらくトリックを実行します。ベスのアスタリスクの提案も同様に機能しますが、より微妙です。

必要なフィールドのストロークを別の色にすることもできます。おそらく、フィールドの横に感嘆符のアイコンを配置しますか?

何をするにしても、一貫性があり、ユーザーが最初に送信せずに間違いを犯した場合は、すぐにフィードバックを提供する必要があります。

これらのインジケーターが適切に配置されていない限り、送信ボタンはグレー表示されません。そうしないと、ユーザーは必要なフィールドがわかりません。

0
Chris N.