サポート » プラグイン » カスタム投稿で郵便番号から住所を表示させたい

  • 解決済 marusyo

    (@marusyo)


    ページをリンクしましたが
    http://yahss.net/wordpress/1295-auto-address-by-zipcode/
    このサイトに紹介されているようにカスタム投稿に
    郵便番号フィールドと、住所フィールドをつくり、
    郵便番号フィールドを入力すると住所が表示されるようにしたいです。

    上記サイトに記載されているソースが下記で、
    functions.php に投稿スラッグを修正し
    各フィールド名はzipcode,addrに設定している
    のですが、うまく動きません。

    どこを修正すれば(もしくは確認)いいのでしょうか?
    また、他に要件を満たす情報サイトがあれば教えて頂きたいです。

    投稿タイプ:estate
    郵便番号フィールド:zipcode
    住所フィールド:addr

    function my_print_footer_scripts() {
    global $post_type;
    // 投稿タイプがestateなら
    if ($post_type == ‘estate’): ?>
    <script type=”text/javascript”>
    jQuery(function($){

    // 郵便番号入力による住所自動入力
    $(‘#acf-field-zipcode’).live(‘change’, function(){
    var zip = $(this).val();
    var url = ‘http://api.zipaddress.net?callback=?’;
    var query = {‘zipcode’: zip};
    $.getJSON(url, query, function(json){
    $(‘#acf-field-addr’).val(json.fullAddress);
    });
    });

    });
    </script>
    <?php
    endif;
    }

    // admin_print_footer_scriptsにフックしてestateの投稿画面表示時の下部にスクリプトを設置
    add_action(‘admin_print_footer_scripts’, ‘my_print_footer_scripts’, 21);

    ヘルプの必要なページ: [リンクを見るにはログイン]

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • こんにちは

    とりあえず、

    $(‘#acf-field-zipcode’).live(‘change’, function(){

    $(‘#acf-field-zipcode’).on(‘change’, function(){

    に変更してみてはどうでしょうか。
    live は jQuery 1.9 で廃止されたと思います。
    WordPress 5.2 を使っているなら、jQuery は 1.12 が入っている気がします。

    • この返信は3 日、 21 時間前に  munyagu さんが編集しました。
    • この返信は3 日、 21 時間前に  munyagu さんが編集しました。

    ご回答有難うございます。
    変更してみましたが、動きませんでした。

    引き続きこちらのソースでも、違うものでも構いませんので
    カスタム投稿で郵便番号から住所を紐づけるものを
    ご存知の方がいらっしゃいましたらご教授ください。

    yuki

    (@yuki84yuki)

    カスタムフィールドにクラス名を付けられるなら
    あとはJSのライブラリを読み込ませるだけで実装できるものがありますが…
    https://github.com/yubinbango/yubinbango

    こんな感じではどうでしょうか。

    抜粋

    jQuery(function($) {
      $('.acf-field[data-name="zipcode"] input').on('change', function() {
        var zip = $(this).val();
        var url = 'https://api.zipaddress.net';
        var query = {'zipcode': zip};
        $.getJSON(url, query, function(json) {
          $('.acf-field[data-name="addr"] input').val(json.data.fullAddress);
        });
      });
    });

    ishitaka 様
    yuki 様

    ご回答有難うございます。
    ishitaka さんがご提示下さった修正案にて無事動作しました。

    誠に有難うございました。

5件の返信を表示中 - 1 - 5件目 (全5件中)
  • このトピックに返信するにはログインが必要です。