郵便番号から自動的に住所入力させる

cakePHP3 + bootstrap5 プロジェクトで郵便番号入力から自動的に住所欄を入力できるようにしてみました。

ふだん、css/jsはバージョンによって動きが変わったりしないよう、サーバ上にコピーして利用するようにしてますが 市区町村合併などで郵便番号が変化する場合があるので、こちらはgithubのサイトを参照するようにしてます。

[slip.ctp]

≤?php

$this->Html->script("//yubinbango.github.io/yubinbango/yubinbango.js", ['block' => true]);

?>

≤div class="col-md-6 h-adr">
    ≤span class="p-country-name" style="display:none;">Japan≤/span>
    ≤table class="table_client_info as_bd_cl">
        ≤tr>
            ≤th>≤input type="button" class="form-control as_button" value="着住所">≤/th>
            ≤th style="text-align: right;">郵便番号≤/th>
            ≤td>
                ≤input type="text" class="form-control p-postal-code" placeholder="郵便番号を入力" />
            ≤/td>
        ≤/tr>
        ≤tr>
            ≤th>住所１≤/th>
            ≤td colspan="2">
                ≤input type="text" class="form-control p-region p-locality p-street-address" placeholder="住所を入力" />
            ≤/td>
        ≤/tr>
        ≤tr>
            ≤th>住所２≤/th>
            ≤td colspan="2">
                ≤input type="text" class="form-control p-extended-address" placeholder="建物名、部屋番号を入力" />
            ≤/td>
        ≤/tr>

cssクラス部分は、サイズとか罫線を設定してます。
いやー。しかし、こりゃ便利だｗ
めでたしめでたし。

【追記】
最近になって、郵便番号での住所入力が必要になって、自分のブログを参照にしてみたら、なかなか動いてくれなかった(笑)
原因は、class="h-adr" を付加してなかったからでした。
上記の例では上部の div タグに設定してますね。
ここ、忘れないようにしてくださいｗ