Kawanet Blog II

アクセスカウンタ

zoom RSS JsonpZip プレビュー! 住所プルダウンから郵便番号自動入力

<<   作成日時 : 2008/01/28 18:11   >>

なるほど(納得、参考になった、ヘー) ブログ気持玉 27 / トラックバック 0 / コメント 4

思いつきで Google Code で JSONP Hosting というプロジェクトを始めてみました。
その第1弾として、郵便番号〜住所の相互変換を行う JsonpZip を準備中です。
まだテストやドキュメントが未整備で、ソースも未完成ですが、とりあえずお試しプレビュー。
 
2005年3月にリリースした AjaxZip に始まり、住所入力フォームに Ajax を導入することで、
面倒な操作なく より快適にするプロジェクトを進めてきました。
郵便番号・住所系の API・Web サービスとしては、他にも いろいろな種類 が登場してきているので、
正直なところ、今さら他にもやることがあるのか?という感じもしていましたが、
今回の JsonpZip では、JSONP を活用した新しいしかけを導入しています。
お試しはこちら: http://jsonp-hosting.googlecode.com/svn/trunk/jsonpzip/sample/sample.html

まず、Lightbox みたいに、rel="" 属性で対象フォームを指定するのがポイント。
onChange イベントも含めて、JavaScript を1行も書かずに済みます。
FTP のみで導入しやすかった AjaxZip2 以上に、デザイナさんにも優しい仕組みです。

<script type="text/javascript" src="http://jsonp-hosting.googlecode.com/svn/trunk/jsonpzip/lib/jsonpzip.js" charset="UTF-8"></script>
<form>
郵便番号:
<input type="text" name="zip3" rel="jsonpzip[zip3]" maxlength="3" size="4"> -
<input type="text" name="zip4" rel="jsonpzip[zip4]" maxlength="4" size="5"><br>
住所:
<select name="pref" rel="jsonpzip[pref]"></select>
<input type="text" name="city" rel="jsonpzip[city]" size="20">
<input type="text" name="area" rel="jsonpzip[area]" size="20"><br>
番地〜号室:
<input type="text" name="strt" rel="jsonpzip[strt]" size="60">
<input type="submit" value="送信">
</form>

主な特徴は以下の通り。

1.郵便番号を入力すると、住所が自動入力される
 ⇒ これは AjaxZip2 と同じ。
2.住所を都道府県→市区町村→大字町域とプルダウンで選択できる
 ⇒ これも ADDRAjax で実現していた。
3.住所を入力すると、郵便番号が自動入力される
 ⇒ 逆引き検索(住所→郵便番号)もいくつかサービスが出てきていますね。
4.自前サーバへの CGI・XML・JSON ファイルの設置が不要
 ⇒ サーバ側 CGI 設定はもとより大量ファイル FTP も不要。デザイナさんにも優しい。
5.Google Code で無料ホスティング提供。
 ⇒ Google 提供のサーバなので安定・高速で、ネットワーク帯域も気にならない。
6.rel="" 属性を書き換えるだけ。JavaScript コード記述不要。
 ⇒ Lightbox のようにプログラムの知識が全くなくても、導入・利用可能。

JSONP フォーマットのデータファイルと Google Code のホスティングを組み合わせることで、
サーバ側のデータベースやプログラム稼動もファイル設置も不要になる仕組みです。
また、既にページ内で Prototype.js や jQuery などのライブラリを利用している場合でも、
干渉が発生しないのも嬉しい。
詳しい使い方は、正式リリースをご期待ください♪
 
 
JSONP-SE は、半分ネタなので、今回は利用していません。

テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ
気持玉数 : 27
なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
驚いた 驚いた 驚いた 驚いた
ナイス ナイス ナイス ナイス
ガッツ(がんばれ!) ガッツ(がんばれ!)
面白い
かわいい

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(4件)

内 容 ニックネーム/日時
はじめまして。
・ユーザに入力ではなく、リストから選択
・郵便番号<=>住所選択 の相互検索
ができるものを探しており、ここにたどり着きました。
是非とも利用させていただきたかったのですが・・・
イントラネット内で利用するため、googlecodeを見に行けません・・・。
http://www.kawa.net/works/ajax/ajaxzip2/ajaxzip2.html
こちらの郵便番号辞書を使うようにすることは難しいでしょうか・・・。
りのす
2009/02/04 20:21
りのすさんへ
ローカルの落とせば使用できますよ。
p
2009/03/09 23:23
はじめまして。
非常に重宝させていただいていた内容なのですが、Google Codeの終了に伴い(?)
閲覧できなくなってしまいました。
ダウンロードしたり閲覧したりできるような環境をご検討いただくのは難しいでしょうか?
みず
2016/05/12 19:12
https://github.com/shimadachino0828/jsonp-hosting

誰があげたのかはわかりませんがなくなったjsonzip一式です。
移転先?
2016/06/13 16:01

コメントする help

ニックネーム
本 文
JsonpZip プレビュー! 住所プルダウンから郵便番号自動入力 Kawanet Blog II/BIGLOBEウェブリブログ
文字サイズ:       閉じる