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 コードの例
  4. セッションを保存します。
    これで、ホスト データの構成と、データのプロセスへのマッピングが完了しました。
  5. iFrame ウィジェット に移動します。
    iFrame ウィジェットにオートメーションのリストが表示されます。
    iFrame ウィジェットのオートメーション リストのサンプル。
  6. プロセスをクリックすると、すでにデータがマッピングされて入力された初期フォームが表示されます。
    オートメーション リストの初期フォームと同じ。
    初期フォームには、マッピングされたデータが表示されます。
  7. [送信] をクリックして、オートメーションを実行します。