サービスカタログフォームスクリプトをウィジェットに置き換える

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間：2分

    • サービスポータル のウィジェットを使用して、UI マクロを置き換えることができます。サービスカタログフォームにフォーム上の他のフィールドまたは変数を参照する UI マクロが含まれている場合は、再利用可能なコードを保持するウィジェットを作成し、それをサービスカタログフォーム内に埋め込むことができます。フォーム上の任意の変数フィールドにアクセスするには、特殊な構文を使用します。

    始める前に

    必要なロール：admin または sp_admin

    手順

    1. カタログアイテムフォームで使用するアクションを実行するウィジェットを作成します。
      フォーム上の別の変数にアクセスする簡単なウィジェットの例については、ステップ 7 を参照してください。
    2. 以前に UI マクロや サービスポータル でサポートされていないその他の再利用可能なコンポーネントを使用していたカタログアイテムを開きます。
    3. 関連リストで、カタログアイテムに新しい変数を追加します。
    4. ウィ ジェット フィールドを追加するには、変数フォームを設定します。
    5. [ タイプ ] フィールドで、[ マクロ] を選択します。
    6. [ ウィジェット] フィールドで、目的のアクションを実行するウィジェットを選択します。
    7. オプション: カタログアイテム値にアクセスするには、埋め込みウィジェットで $scope.page.g_form() 構文または $scope.page.field 構文を使用します。
      この例では、1 行テキスト変数の値を、カタログアイテムに関連付けられた名前の 色 で変更する方法を示します。
      ウィジェット HTML テンプレート
      <div>  
  Data from catalog variable:  
  <h1>{{ c.data.message }}</h1>  
</div>
      ウィジェットクライアントスクリプト
      function($scope) {  
     var c = this;  
  
     //Watch for changes in the color variable  
     $scope.$watch(function () {  
          return $scope.page.g_form.getValue('color');  
     }, function (value) {  
     //Update local data object with data from variable  
     c.data.message = value ? 'Content of color variable: ' + value : '';  
});  
}
      変数またはカタログアイテムフィールドにアクセスするには、以下を使用できます。
      • $scope.page.g_form():フォーム上のg_formインスタンス。サービスポータルとクライアントスクリプトで説明されているサポートされているすべてのg_form方法を使用できます。たとえば、 g_form.setValue('variable_name', 'new value');。
      • $scope.page.field():変数を表すオブジェクト。
      サービスポータルでカタログアイテムを開くと、埋め込みウィジェットはカタログアイテムに関連付けられた変数フィールドにアクセスします。

      変数への入力は埋め込みウィジェットに表示されます。