お問い合わせフォームプラグイン「MW MP Form」に郵便番号から住所を自動入力させる方法をご紹介します。
MW MP Formはデフォルトの状態で「入力確認画面」が装備されたプラグインで、いつも重宝して使わせていただいております。
「ajaxzip3」のダウンロード
郵便番号自動入力の実装には「ajaxzip3」が必要です。下記サイトからダウンロードして、functions.phpに「ajaxzip3.js」と処理を記述するファイルを読み込める状態にしてください。
//Jsのファイル名や格納先のパスなどは適宜変更！
function my_script_init() {
wp_enqueue_script( 'ajaxzip3', get_stylesheet_directory_uri() . '/js/ajaxzip3.js', array(), '0.51', true );
wp_enqueue_script( 'my', get_template_directory_uri() . '/js/test.js', array( 'jquery' ), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_script_init' );
上記はjsフォルダ内のtest.jsを読み込む場合です。
MW WP Formの設定
郵便番号フィールド・都道府県フィールド・住所フィールドのname値にそれぞれ、zip・prefecture・addressの名前をつけます。郵便番号フィールドはidの追加も忘れないでください。
<tr> <th>郵便番号</th> <td>[mwform_text name="zip" id="zip"]</td> </tr> <tr> <th>都道府県</th> <td>[mwform_select name="prefecture" children="北海道,青森県,岩手県,宮城県,秋田県,山形県,福島県,茨城県,栃木県,群馬県,埼玉県,千葉県,東京都,神奈川県,新潟県,富山県,石川県,福井県,山梨県,長野県,岐阜県,静岡県,愛知県,三重県,滋賀県,京都府,大阪府,兵庫県,奈良県,和歌山県,鳥取県,島根県,岡山県,広島県,山口県,徳島県,香川県,愛媛県,高知県,福岡県,佐賀県,長崎県,熊本県,大分県,宮崎県,鹿児島県,沖縄県"]</td> </tr> <tr> <th>以降の住所</th> <td>[mwform_text name="address"]</td> </tr>
jQueryの設定
任意の名前（下記例はtest.js）を付けたJsファイルに以下のコードを記述してください。
jQuery( '#zip' ).keyup( function() {
AjaxZip3.zip2addr( this, '', 'prefecture', 'address' );
});
設定等に問題なければ、郵便番号の入力後にフィールドからフォーカスが外れると、prefectureとaddressのフィールドに都道府県と住所が自動的に入力されます。
この記事を書いた人管理人
SAKURAGRAPHICA代表
会社員の傍ら、フリーランスでWEBサイトの制作やWordPressによるCMSの構築・障がい者の就労支援としてホームページ制作の職業指導員も行っております。
