住所を登録するフォーム等で、郵便番号を入力して、郵便番号から住所を検索するという入力インタフェースは、最近だとごくごく当たり前の機能になっています。
EC-CUBEを含め、ほとんどの場合、郵便番号を入力後、『郵便番号から検索』するボタンをクリックすると、住所入力フォームに該当する住所が自動入力されるというものが多いような気がします。
EC-CUBEの場合、入力された郵便番号からDB内の該当住所を検索して表示するという処理を行っています。
今回ご紹介する『 AjaxZip 2.0』は、Ajaxでサーバサイドのプログラムを必要とせず、かつ高速に動作するというとても素敵なライブラリです。
『AjaxZip 2.0』
https://www.kawa.net/works/ajax/ajaxzip2/ajaxzip2.html
上記のページに、サンプルがあります。
テキストボックスに郵便番号を入力すると、自動的に住所が入力されます。
『郵便番号から住所を検索する』といったボタンも不要です。
ユーザの手間を一つでも減らし、より直感的なインタフェースを作ることは、私達技術者にとって、最も考慮すべき大事なポイントだと言えます。
webに限ったことではないですが、普段『めんどくさいな』と思うところ == 改善点 であり、
その点に慣れるのではなく、これら一つ一つを改善していく努力を惜しまないように心がけたいですね。
投稿者プロフィール
- サンクユーのEC-CUBE担当。15年以上にわたりEC-CUBE開発に従事し、2系・3系・4系すべてに精通。難易度の高いカスタマイズや、他社構築サイトの改修・再設計も多数対応しています。
Javaでの業務システム開発を起点に、PHP・Perl・フロントエンド・CMSまで横断的に対応。基幹システム連携や業務フローを踏まえた設計を得意とし、複雑な要件にも柔軟に対応可能です。
ChatGPT CODEXを活用し、開発スピードと品質の両立を実現しています。
