画面でエフェクトの実現の(二) --関連項目の自動入力

前の入力ボックスを入力すると、後の入力ボックスが自動入力された。例えば、楽天ショッピング上で、住所を入力するとき、郵便番号を入力すると、後ろの住所が自動的に入力された。
##実装要点##
これはAjaxの典型的な使用だと思います。
・ボタンの上でonblurのイベント処理プログラムを設置
・入力する項目の項目名を渡す
・サーバ側から値をもらう
・戻り値を後ろの項目に設置
##コードサンプル##

//ボタンの上でonblurのイベント処理プログラムを設置
<input id="postNo" onblur="blurA(postNo,xxx);" />

// 入力する項目の項目名を渡す
function blurA(inputString){
//パラメータリストにより、画面の入力した項目の内容を取得
$.each(keyList,function(index, key){
// 入力値を取得
value = $("#" + key).val();
inputKey=$("[name='"+name+"'");
inputKey.val(value);
})
}

//サーバ側から値をもらう
$.ajax( contextPath + "url",
data:$("#" +formname).serialize(),
).done(function(json)){
  if(json[formname] != null){
　  // 戻り値を後ろの項目に設置
    each { 
      $("#"+name).val(json[formname][value]); 
    }
  }
}