こんにちは、IISの吉井です。

プリザンターはAPIやJavascriptで様々な外部システムと連携できる拡張性の高さも特徴の一つです。

当BolgでもAPIについてなんどか取り上げておりますが、
外部公開されているAPIからのデータ取得、ということをやってみましょう。

モデルは良くある郵便番号から住所を検索する、というやつです。
郵便番号マスタのデータメンテンナンスはめんどうですよね。
いつでも最新のマスタ情報を得るには外部API連携が最適です。

郵便番号APIは以下のサービスを利用しました。
http://zipcloud.ibsnet.co.jp/doc/api

実現したいこと

郵便番号（分類A）を入力してボタンを押下すると、
プリザンターに登録したスクリプトから外部APIをコールして、
都道府県（分類B）、住所1（分類C）にセットします。

都道府県マスタは、プリザンターのテンプレートのものをリンク項目に設定してます。
（新規作成＞分類マスタ＞都道府県マスタ）

f:id:imageinformationsystem:20190212180851p:plain

今回は郵便番号に複数照合する場合でも1件のみ処理することとします。

以下のスクリプトを登録します。

テーブル管理＞スクリプトを登録します。
下記の画面より「新規作成」ボタンを押下します。

f:id:imageinformationsystem:20190212180959p:plain

編集画面で実行したいので、出力先は「新規作成」「更新」を設定しましょう。

f:id:imageinformationsystem:20190212181003p:plain

最後にテーブル管理の「更新」ボタンを押すことを忘れずに。
私はすぐこれを忘れてしまいます・・・。

f:id:imageinformationsystem:20190212181009p:plain

スクリプトには以下を入力します。

$p.events.on_editor_load = function(){
    $('#Results_ClassAField').after($('<button onclick="$p.ex.execPostSearch();">郵便検索</button>').button({icon: 'ui-icon-search'}));
}
$p.ex.execPostSearch = function() {
    //JSONPを利用する
    $.getJSON('http://zipcloud.ibsnet.co.jp/api/search?callback=?',
      {
        zipcode: $('#Results_ClassA').val()   // 入力した郵便番号
      }
    )
    // 結果を取得したら…
    .done(function(data) {
      if (data.results) {
        //結果(1件セット版)
        var result = data.results[0];
        var pref = ('00' + result.prefcode).slice(-2);
        $p.set($('#Results_ClassB'), pref);
        $p.set($('#Results_ClassC'), result.address2 + result.address3);
      } else {
        // 中身が空の場合は、エラーメッセージを反映
        alert('該当する住所が存在しません。');
      }
    });
}

少し解説

2行目

ボタンタグを追加します。追加位置を、Results(記録テーブル)のClassAフィールドの後ろ、という記述に仕方をしております。 $p.events.on_editor_load はプリザンターの用意されているイベント定義でエディタのロード完了時に呼び出されます。

6行～10行目

JSONPでcallbackで外部APIに問合せします。

13行目～

問合せ結果を画面上の「都道府県」（Results_ClassB）、「住所1」（Results_ClassC）にセットします。この外部APIは県コードを0無しで返しますので、こちらの都道府県マスタに合わせて、頭に0をつける編集を行ってます。 APIからの返却値のaddress2(市区町村)とaddress2(町域名)をこちらの「住所1」にセットしてます。