web-dev-qa-db-ja.com

カナダの郵便番号入力フィールド

カナダの郵便番号は、3つの文字と3つの数字を挿入したものです。例：M1K 3H7

カナダの郵便番号は、ユーザーが入力フォームフィールドに入力するのが非常に困難です。特に、ユーザーがキーボード（アルファベットから数字キーボード）に切り替える必要があるモバイルデバイスではそうです。彼はキーボードのレイアウトを5または6回切り替える必要があります。

enter image description here

フィールドを2つに分けると、エクスペリエンスがさらに複雑になる可能性があります。エクスペリエンスを簡単にする方法について何か提案はありますか？

formsinputinput-fieldsaddresses
8
Raoul Alin Flaminzeanu

標準のテキストフィールドを使用するだけです。郵便番号の入力は、見た目ほど難しくはありません。

regex を使用して空白を区切り、数値と文字を自動的に切り替えることができます。つまり、郵便番号を入力すると、パターンがわかっているため、モバイルキーパッドで数字と文字を強制的に切り替えます。ここでは、自動提案が最良のオプションです。

カナダの郵便番号は、英国の郵便番号に似ており、複雑ではありません。英国の郵便番号の区切りは4-3、3-3、4-3のいずれかです。いくつかのバリエーションがあります。

これらは私たちが英国で持っているすべてのパターンです

  A9 9AA
 A9A 9AA
 A99 9AA
 AA9 9AA
AA9A 9AA
AA99 9AA

英国のポストオフィスを含むいくつかのサイトは、UXの標準のテキストフィールドパターンを使用して（Webサイトおよびデジタルフォームで）、物理的な分離 紙のフォームとPDF （26ページを参照）

enter image description hereenter image description here

6
Rayraegah

おそらく、ユーザーが住所を入力し始め、選択可能な住所を表示し、探している住所である住所の1つを選択できる、Googleマップに類似したものを実装してみることができます。住所全体を入力します。

Google Maps address searching example

私がGoogleマップで使用した米国の住所の場合、実際に郵便番号を入力して検索する住所を選択する必要はありませんでした（米国の郵便番号は5桁の数字です）。

1
pkr298

ユーザーが郵便番号を指定するのをまったく避けないのはなぜですか？アプリケーションにアドレスに基づいてそれを調べさせます。

0
Bill Dagg

これを行う1つの方法は、AddressとCanadaPost APIを使用して郵便番号を収集することです https://www.canadapost.ca/pca/support/webservices

ユーザーに手動で入力してもらいたい場合は、6つのフィールドを使用し、テキストと数値を交互に入力します（これにより、適切なキーボードが切り替わります）。フィールドは、1つのフィールドとして表示されるようにスタイル設定できます。最初にユーザーでこれをテストすることを強くお勧めします！

0
MediaFormat