Home > HTML5 | Java > フォームで郵便番号を入力したら自動的に住所を入力する方法

フォームで郵便番号を入力したら自動的に住所を入力する方法

最近、HTML5でコーディングしなければならなくなり、その便利さ、素晴らしさに感動していたのだが、
そんな中でHTML5ではないがAjax(Asynchronous JavaScript + XML)でめちゃ簡単に色んな事ができるじゃないか!!
フォームで郵便番号を入れると住所が反映されるシステムを入れるのにサーバーにcgiなんかを設置したものだが
(郵便番号や住所が変わるとデータベースの書換が必要)、何と今やGoogle APIでたったコード2行で実現できるって(^-^;


書き方は簡単
ヘッダーに下記のスクリプトを1行追加

<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title></title>
<script src="http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3.js" charset="UTF-8"></script>
</head>

 
フォームの郵便番号入力のinputにAjaxを呼び出す1文を追加

<input type="text" name="郵便番号" size="10" maxlength="8" onKeyUp="AjaxZip3.zip2addr(this,'','都道府県','住所1');"> 

<input type="text" name="都道府県" size="20"> 
<input type="text" name="住所1" size="60">

 

 これで郵便番号入れれば住所が反映されます。
昔、一生懸命、SQLサーバー使ったり、Perlで書いたりしていた事の苦労が1文でって思うと(^-^;

コメント:0

コメントフォーム
Remember personal info

トラックバック:0

このエントリーのトラックバックURL
http://meiya.jp/wp-trackback.php?p=155
Listed below are links to weblogs that reference
フォームで郵便番号を入力したら自動的に住所を入力する方法 from KURA BASE

Home > HTML5 | Java > フォームで郵便番号を入力したら自動的に住所を入力する方法

New Topics

Return to page top

%d人のブロガーが「いいね」をつけました。