チュートリアル:フォームデータモデルの作成

04-create-form-data-model-main

これは、「最初のアダプティブフォームを作成する」シリーズを構成するチュートリアルです。チュートリアル内のユースケースを理解して実際に操作できるように、このシリーズのチュートリアルを最初から順に学習することをお勧めします。

このチュートリアルについて

AEM Formsデータ統合モジュールを使用すると、AEMユーザープロファイル、RESTful Webサービス、SOAPベースのWebサービス、ODataサービス、リレーショナルデータベースなど、様々なバックエンドデータソースからフォームデータモデルを作成できます。 フォームデータモデル内でデータモデルオブジェクトとサービスを設定し、そのフォームデータモデルをアダプティブフォームに関連付けることができます。アダプティブフォームのフィールドは、データモデルオブジェクトのプロパティに連結されます。フォームデータモデル内のサービスを使用して、アダプティブフォームに事前にデータを取り込み、送信されたフォームデータをデータモデルオブジェクトに書き込むことができます。

フォームデータの統合機能とフォームデータモデルについて詳しくは、「AEM Forms のデータ統合機能」を参照してください。

このチュートリアルでは、フォームデータモデルの準備、作成、設定を行い、そのフォームデータモデルをアダプティブフォームに関連付けるための手順について、順を追って説明します。このチュートリアルを完了すると、次の操作を実行できるようになります。

フォームデータモデルは、以下のように表示されます。

form-data-model_l

A. 設定済みデータソー スB. データソーススキーマ C. 使用可能なサービス D. データモデルオブジェクト E. 設定済みサービス

前提条件

作業を開始する前に、以下の条件が満たされているかどうかを確認してください。

手順 1:MySQL データベースをデータソースとして設定する

各種のデータソースを設定して、フォームデータモデルを作成することができます。このチュートリアルでは、サンプルデータが取り込まれた MySQL データベースの設定を行います。サポートされている他のデータソースとその設定方法については、「AEM Forms のデータ統合機能」を参照してください。

MySQLデータベースを設定するには、次の手順を実行します。

  1. MySQLデータベース用のJDBCドライバーをOSGiバンドルとしてインストールします。

    1. AEM Formsオーサーインスタンスに管理者としてログインし、AEM Webコンソールバンドルに移動します。 デフォルトのURLはhttps://localhost:4502/system/console/bundlesです。

    2. 「インストール/更新」をタップします。 「Upload / Install Bundles」ダイアログが表示されます。

    3. Choose File」をタップし、 JDBC ドライバーの OSGi バンドルを探して選択します。MySQL「Start Bundle」と「Refresh Packages」を選択し、「Install or Update」をタップします。 MySQLのOracle Corporation’s JDBCドライバーがアクティブであることを確認します。 このドライバーは、既にインストールされています。

  2. MySQLデータベースをデータソースとして設定します。

    1. AEM Webコンソール(https://localhost:4502/system/console/configMgr)に移動します。

    2. Apache Sling Connection Pooled DataSource」という設定を探し、その設定をタップして編集モードで開きます。

    3. 設定ダイアログで、以下の詳細情報を指定します。

      • Datasource name:任意のデータソース名を指定します。例えば、WeRetailMySQL​を指定します。

      • DataSource service property name:データソース名を保管するサービスプロパティの名前を指定します。この名前は、データソースインスタンスを OSGi サービスとして登録する際に指定されます。例えば、「datasource.name」などを指定します。

      • JDBC driver class:JDBC ドライバーの Java クラス名を指定します。MySQLデータベースの場合は、com.mysql.jdbc.Driver​を指定します。

      • JDBC connection URI:データベースの接続 URL を指定します。ポート3306およびスキーマweretailで実行されるMySQLデータベースの場合、URLは次のようになります。jdbc:mysql://'server':3306/weretail?autoReconnect=true&useUnicode=true&characterEncoding=utf-8

      • Username:データベースのユーザー名を指定します。データベースとの接続を確立するには、JDBC ドライバーを有効にする必要があります。

      • Password:データベースのパスワードを指定します。データベースとの接続を確立するには、JDBC ドライバーを有効にする必要があります。

      • 借入テスト: 「借入テスト」オプシ ョンを有効 にします。

      • Test on Return: 「Test on Return」オプショ ンを有効に します。

      • Validation Query:プールからの接続状態を確認するための SQL SELECT クエリを指定します。このクエリでは、1 行以上の行が返される必要があります。例えば、「select * from customerdetails」などを指定します。

      • Transaction Isolation:このオプションの値を「READ_COMMITTED」に設定します。

        他のプロパティはデフォルトののままにし、「保存」をタップします。

        以下のような設定が作成されます。

        relational-database-data-source-configuration

手順 2:フォームデータモデルを作成する

AEM Formsは、設定済みのデータソースからフォームデータモデル🔗を作成するための直感的なユーザーインターフェイスを提供します。 1 つのフォームデータモデル内で複数のデータソースを使用することができます。このユースケースでは、設定済みのMySQLデータソースを使用します。

フォームデータモデルを作成するには、以下の手順を実行します。

  1. AEM オーサーインスタンスで、フォームデータ統合​に移動します。

  2. 作成フォームデータモデル​の順にタップします。

  3. フォームデータモデル作成ダイアログで、フォームデータモデルの​名前​を指定します。例えば、「customer-shipping-billing-details」などを指定します。「次へ」をタップします。

  4. データソース選択画面に、すべての設定済みデータソースが一覧表示されます。WeRetailMySQL​データソースを選択して「作成」をタップします。

    data-source-selection

customer-shipping-billing-details​フォームデータモデルが作成されます。

手順 3:フォームデータモデルを設定する

フォームデータモデルを設定するには、以下の操作を行う必要があります。

  • データモデルオブジェクトとサービスの追加
  • データモデルオブジェクト用の読み取りサービスと書き込みサービスを設定する

フォームデータモデルを設定するには、以下の手順を実行します。

  1. AEMオーサーインスタンスで、Forms / データ統合​に移動します。 デフォルトのURLはhttps://localhost:4502/aem/forms.html/content/dam/formsanddocuments-fdmです。

  2. 先ほど作成した​customer-shipping-billing-details​フォームデータモデルがここに表示されます。 このフォームデータモデルを編集モードで開きます。

    前の手順で選択した WeRetailMySQL というデータソースが、フォームデータモデル内に設定されています。

    default-fdm

  3. データソースツリーで WeRailMySQL データソースを展開します。データモデルを形成するには、 weretail > customerdetails​スキーマから次のデータモデルオブジェクトとサービスを選択します。

    • データモデルオブジェクト:

      • id
      • name
      • shippingAddress
      • 市区町村
      • state
      • zipcode
    • Services:

      • get
      • 更新

    選択項目を追加」をタップして、選択したデータモデルオブジェクトとサービスをフォームデータモデルに追加します。

    WeRetailスキーマ

    メモ

    JDBCデータソースのデフォルトのget、update、insertサービスは、フォームデータモデルと共に標準で提供されています。

  4. 以下の手順により、データモデルオブジェクトの読み取りサービスと書き込みサービスを設定します。

    1. customerdetails」データモデルオブジェクトを選択して「プロパティの編集」をタップします。

    2. 「読み取りサービス」ドロップダウンで「get」を選択します。id​引数( customerdetailsデータモデルオブジェクトのプライマリキー)が自動的に追加されます。 aem_6_3_editをタップし、引数を次のように設定します。

      read-default

    3. 同様に、書き込みサービスとして「update」を選択します。customerdetails オブジェクトが引数として自動的に追加されます。この引数を以下のように設定します。

      write-default

      id 引数を追加して以下のように設定します。

      id-arg

    4. 完了」をタップして、データモデルオブジェクトのプロパティを保存します。次に、「保存」をタップして、フォームデータモデルを保存します。

      get サービスと update サービスが、データモデルオブジェクトのデフォルトのサービスとして追加されます。

      data-model-object

  5. サービス」タブに移動し、get サービスと update サービスを設定します。

    1. get​サービスを選択し、「プロパティを編集」をタップします。 プロパティダイアログが開きます。

    2. プロパティを編集ダイアログで、以下のプロパティを指定します。

      • タイトル:サービスのタイトルを指定します。例えば、「Retrieve Shipping Address」などを指定します。

      • 説明:サービスの詳細な機能を示す説明を入力します。以下に例を示します。

        このサービスは、MySQLデータベースから配送先住所とその他の顧客の詳細を取得します

      • 出力モデルオブジェクト:顧客データを保管するスキーマを選択します。以下に例を示します。

        customerdetailスキーマ

      • 配列を返す:「配列を返す」オプションを無効にします。

      • 引数ID という引数を選択します。

      完了」をタップします。これで、顧客の詳細情報を MySQL データベースから取得するサービスが設定されました。

      shiping-address-retrieval

    3. update​サービスを選択し、「プロパティを編集」をタップします。 プロパティダイアログが開きます。

    4. プロパティを編集ダイアログで、次の情報を指定します。

      • タイトル:サービスのタイトルを指定します。例えば、「Update Shipping Address」などを指定します。

      • 説明:サービスの詳細な機能を示す説明を入力します。以下に例を示します。

        このサービスは、MySQLデータベースの配送先住所と関連するフィールドを更新します

      • 入力モデルオブジェクト:顧客データを保管するスキーマを選択します。以下に例を示します。

        customerdetailスキーマ

      • 出力タイプ:「ブール演算式」を選択します。

      • 引数ID という引数と customerdetails という引数を選択します。

      完了」をタップします。これで、 データベース内の顧客の詳細情報を更新する update サービスが設定されました。MySQL

      shiping-address-update

これで、フォームデータモデル内のデータモデルオブジェクトとサービスが設定されました。次に、フォームデータモデルのテストを実行します。

手順 4:フォームデータモデルのテストを実行する

データモデルオブジェクトとサービスをテストして、フォームデータモデルが正しく設定されていることを確認できます。

テストを実行するには、以下の手順を実行します。

  1. モデル」タブに移動し、customerdetails データモデルオブジェクトを選択して「モデルオブジェクトをテスト」をタップします。

  2. 「モデル / サービスのテスト」ウィンドウの「モデル / サービスを選択」ドロップダウンで「モデルオブジェクトを読み込み」を選択します。

  3. customerdetails​セクションで、設定したMySQLデータベースに存在する​id​引数の値を指定し、Test​をタップします。

    指定した id 引数に関連付けられている顧客の詳細情報がデータベースから取得され、以下のように「出力」セクションに表示されます。

    test-read-model

  4. 同様の手順で、書き込みモデルオブジェクトと書き込みサービスをテストします。

    以下の例では、データベース内で 7102715 という ID が設定されている住所情報が、update サービスによって正しく更新されています。

    test-write-model

    この状態で、7102715 という ID に対して読み取りモデルサービスのテストをもう一度実行すると、以下のように、更新後の顧客情報が画面に表示されます。

    読み取り更新済み

このページ