HTML からフォームにデータをマッピングする

ホスト アプリケーションからウィジェットを構成し、iFrame ウィジェットの初期フォームにデータを入力します。これにより、データ入力を繰り返すことなく、データを確実に管理することができます。

前提条件

次の手順が完了していることを確認してください。

  • Co-Pilot ユーザー用にシステムで作成された [AAE_Robotic_Interface User] ロールが入力されている。
  • Web インターフェースの Automation Co-Pilot for Business Users にアクセスできる。
  • iFrame テクノロジーをサポートしている任意のホスト Web アプリケーションにアクセスできる。
  • iFrame ウィジェットをすでに設定している。詳細については、「Web アプリケーションで iFrame ウィジェットを構成する」を参照してください。

手順

  1. ホスト Web アプリケーションにログインします。
    これは、iFrame ウィジェットを含むターゲット アプリケーションです。
  2. ウィジェットの設定ページまたは (iFrame ウィジェットのコードを追加した) ホスト Web アプリケーションのソース コードに移動します。
    このページには、ウィジェット ソースの埋め込みコードが含まれています。
  3. スクリプトにホスト データと送信データを入力します。
    重要: データをマッピングするには、プロセス ID、要素 ID、および要素 ID の値を相互に関連付けて、ホスト Web アプリケーションにプロセスをロードする必要があります。
    ホスト データの構成例:
    hostData =
{
 process ID
    {
       elementID1: value1
       elementID2: value2
       elementID3: value3
   }
} 
sendDataToEmbeddedApp = (processID) =>
{
    iframeElement = document.querySelector();
    iframeElement.contentWindow.postMessage({data: hostData[processID]}, 
        iframeElement.getAttribute());
}
    注: 要素 ID では、フォーム要素データ タイプを使用します。例: チェックボックス、数字、ラジオボタン、テキストボックス。
    追加のサンプル構造:
    HTML での hostData のサンプル。
    HTML での hostData のサンプル。
    この例では、45 はプロセス ID、Number0 は要素 ID、45 は要素 ID の値です。
  4. セッションを保存します。
    これで、ホスト データの構成と、データのプロセスへのマッピングが完了しました。
  5. iFrame ウィジェット に移動します。
    iFrame ウィジェットにオートメーションのリストが表示されます。
    iFrame ウィジェットのオートメーション リストのサンプル。
  6. プロセスをクリックすると、すでにデータがマッピングされて入力された初期フォームが表示されます。
    オートメーション リストの初期フォームと同じ。
    初期フォームには、マッピングされたデータが表示されます。
  7. [送信] をクリックして、オートメーションを実行します。