プリザンター新機能紹介:スクリプト編その1

こんにちは。IISの田口です。
プリザンターに新機能が続々追加!で紹介したプリザンターの新機能について詳しく紹介します。
今回は「JavaScriptからAPIを呼ぶためのメソッドを追加」について紹介します。

JavaScriptからAPIを呼ぶためのメソッド

今までJavascriptAPIを呼ぶ場合は以下のような記述をしていました。
※ソースはプリザンターのAPI連携を試してみた!(実践編)の記事のものです。

$(document).on('change', '#Results_ClassA', function(){
  var childSiteId = '4';
  var selectVal = $('#Results_ClassA').val();
  var uri = $('#BaseUrl').val().replace('items', 'api_items') + childSiteId + '/get';
  var json = {
    'ApiKey': '',
    'Offset': 0,
    'View': {
      'ColumnFilterHash': {
        'ClassA': '["' + selectVal + '"]'
      },
      'ColumnSorterHash': {
        'Title': 'asc'
      }
    }
  };
  
  $.post(uri, JSON.stringify(json),'json')
  .done(function(data){
    $('#Results_ClassB').children().remove();
    for(var item of data.Response.Data){
      $('#Results_ClassB').append($('<option>').val(item.ResultId).text(item.Title));
    }
  })
  .fail(function(){
    //alert('失敗');
  })
  .always(function(){
    //alert('完了');
  });
});

これが新機能のメソッドを利用すると以下のようになります。

$(document).on('change', '#Results_ClassA', function(){
  var childSiteId = '4';
  var selectVal = $('#Results_ClassA').val();

  $p.apiGet({
    'id': childSiteId,
    'data': {
      'ApiKey': '',
      'Offset': 0,
      'View': {
        'ColumnFilterHash': {
          'ClassA': '["' + selectVal + '"]'
        },
        'ColumnSorterHash': {
          'Title': 'asc'
        }
      }
    },
    'done': function(data) {
      $(#Results_ClassB).children().remove();
      for(var item of data.Response.Data){
        $('#Results_ClassB').append($('<option>').val(item.ResultId).text(item.Title));
      }
    },
    'fail': function() {
        //alert('失敗');
    },
    'always': function() {
        //alert('完了');
    }
  });
});

大分(?)すっきりしましたね。

少し解説

$p.apiGet(args)が新機能のメソッドになります。
argsは以下の値を設定します。

  • id:操作対象のレコードIDまたはサイトID
  • data:POSTするjsonデータ
  • done:$.ajaxのdoneオプション。API通信成功時の処理を記述
  • fail:$.ajaxのfailオプション。API通信失敗時の処理(任意)
  • always:$.ajaxのalwaysオプション。API通信完了時の処理(任意)

上記ソースはAPIで複数データを取得するサンプルになりますが、他にも各API用のメソッドが準備されています。

  • $p.apiCreate(args):新規登録API用メソッド
  • $p.apiUpdate(args):更新API用メソッド
  • $p.apiDelete(args):削除API用メソッド

なお、取得API用メソッドは$p.apiGet(args)で共通です。idとdataの指定内容によってレコードID指定での取得か、サイトIDに対する複数データ取得の結果を得ることが出来ます。

JavascriptでのAPI操作はスクリプトによるカスタマイズで非常に威力を発揮します。
API用メソッドが提供されたことですっきり見やすいコードになりますので、開発効率もアップすると思います。

最後に  

IISはプリザンターのスクリプトによるカスタマイズの経験が豊富です。
プリザンター導入に際してカスタマイズをご検討されている方は是非ご相談ください!
またご不明点やご質問などございましたら弊社までお問い合わせください。