現在表示中:

アダプティブフォームは、ダイナミックなスクリプト機能によってエンドユーザーのフォームへの入力作業を最適化および簡素化します。式を記述することで、ダイナミックなフィールドやパネルの表示/非表示などの様々な動作を追加できます。またレポートを作成する計算指標フィールドを追加したり、フィールドを読み取り専用にしたり、検証ロジックを追加したりすることも可能です。動的動作は、ユーザー入力や事前入力に基づいています。 

アダプティブフォームの式言語はJavascriptです。すべての数式は有効なJavaScriptの数式で、アダプティブフォームのスクリプトモデルAPIを使用しています。これらの数式は、特定のタイプの値を返します。アダプティブフォームクラス、イベント、オブジェクト、パブリック API の完全なリストについては、「アダプティブフォームの JavaScript ライブラリ API リファレンス」を参照してください。

式を記述するためのベストプラクティス

  • 式を記述したり、フィールドやパネルにアクセスしたりする場合は、フィールド名またはパネル名を使用します。フィールドの値にアクセスするには、valueプロパティを使用します。例えば、フィールド1.value
  • フォーム間でフィールド名およびパネル名には一意の名前を付けてください。式を記述する場合に使用されているフィールド名を使用すると競合を回避しやすくなります。
  • 複数行にわたる式を記述する場合、セミコロンを使用して分を終了します。

繰り返しパネルを含む式のベストプラクティス

繰り返しパネルは、スクリプティングAPIまたは事前に入力されたデータを使用して追加または削除されたインスタンスのパネルです。繰り返しパネルの使用に関して詳しくは、繰り返し可能なセクションでのフォーム作成を参照してください。

  • 繰り返しパネルを作成するためには、パネルダイアログで設定を開きます。そして最大カウントの値を1以上に設定します。
  • 繰り返しパネル設定の最小カウントの値は、一つ以上設定することが可能ですが、最大値を超えてはなりません。
  • 式が繰り返しパネルのフィールドを参照する場合、その式のフィールド名は一番近い繰り返し要素に解決されます。
  • アダプティブフォームには、合計、カウント、最小値、最大値、フィルター等の繰り返しパネルの計算を簡素化するためのいくつかの特別な機能があります。全機能のリストについては、JavaScript ライブラリアダプティブフォームのAPI リファレンスを参照してください。
  • 繰り返しパネルのインスタンスを操作するためのAPIは:
    • パネルインスタンスを追加するには:パネル1.instanceManager.addInstance ()に従います
    • 繰り返しパネルのインデックスを取得するには:パネル1.instanceIndexに従います
    • パネルのInstanceManagerを取得するには:_パネル1またはパネル1.instanceManagerに従います
    • パネルのインスタンスを削除するには、_panel1.removeInstance(panel1.instanceIndex)に従います

式のタイプ

アダプティブフォームでは、式を記述してダイナミックなフィールドやパネルの表示/非表示などの動作を追加することができます。また、式を記述することで、計算指標フィールドを追加したり、フィールドを読み取り専用にしたり、検証ロジックを追加したりすることも可能です。アダプティブフォームは次の数式をサポートします:  

アクセス式(イネーブルメント式)

アクセス式を使用してフィールドを有効/無効にできます。フィールドの値が数式に使用されている場合、フィールドの値が変わるときは常に数式がトリガされます。

適用性:フィールド

戻り値の型 :数式は、フィールドが有効/無効であることを表すブール値を返します。trueはフィールドが有効であることを表し、falseはフィールドが無効であることを表します。

:フィールド1の値がXに設定されている場合のみフィールドを有効にするための数式は次の通りです:field1.value == "X""

数式の計算

数式の計算は、式を使ってフィールドの値を自動計算するのに使用されます。通常、この式には、他のフィールドの値プロパティを使用します。例えば、フィールド2.バリュー+フィールド3.バリューというように。フィールド2またはフィールド3の値が変わる場合は、常に数式がトリガされ、値は再計算されます。

適用性:フィールド

戻り値の型 :数式は、式の結果が表示されるフィールドに対応する値を返します(例えば、小数値)。

:フィールド1の2つのフィールドの合計を出す数式の計算は次の通りです
フィールド2.バリュー+フィールド3.バリュー

クリック式

クリック式は、数式をクリック:ボタンのクリックイベント上で実行された操作を処理します。GuideBridgeは、送信や検証などのクリック式と共に使用される様々な機能を実行するためにAPIをデフォルトで提供します。すべての API のリストは、GuideBridge APIs を参照してください。

適任性:ボタンフィールド

戻り値の型:クリック式は値を返しません。数式が値を返した場合、その値は無視されます。

AEMフォーム値を指定してボタンをクリックしてテキストボックス1を入力する場合、ボタンのクリック式は="AEM Forms"です

初期化スクリプト

アダプティブフォームが初期化される場合、初期化スクリプトがトリガされます。シナリオによっては、初期化スクリプトは次のような方法で動作します:

  • アダプティブフォームが、データの事前入力なしでレンダリングされた場合、初期化スクリプトは、フォームが初期化された後で実行されます。
  • アダプティブフォームが、データの事前入力なしでレンダリングされた場合、スクリプトは事前入力操作が完了した後で実行されます。
  • アダプティブフォームのサーバー側の再検証がトリガされた場合、初期化スクリプトが実行されます。

適用先:フィールドおよびパネル

戻り値の型:初期化スクリプトの数式は値を返しません。数式が値を返した場合、その値は無視されます。

例:データの事前入力シナリオにおいて、値がnullとして保存された場合、フィールドにデフォルト値である「アダプティブフォーム」を入力するために、次の初期化スクリプトの数式が用いられます: if(this.value==null) this.value='Adaptive Forms';。

オプション式

オプション式はドロップダウンリストのフィールドをダイナミックに挿入するのに使用されます。

適用性
ドロップダウンリストのフィールド

戻り値の型 :オプション式は文字列値の配列を返します。それぞれの値は男性または1=男性などのキーと値のペアのような単純な文字列である場合があります。

:別のフィールドの値に基づいてフィールドの値を入力するために、単純なオプション式を提供します。例えば、別のフィールドの結婚歴の式に基づいてフィールドに子供の数を入力する場合、式はこのようになります。

marital_status.value == "既婚"  ? ["1=One", "2=two"] : ["0=Zero"]

結婚歴フィールドの値が変わる場合は、常に式が再トリガされます。RESTサービスからドロップダウンを挿入することもできます。詳しくは、「ドロップダウンの動的な挿入」を参照してください。

要約式

要約式はアコーディオンレイアウトパネルの子パネルのタイトルを動的に計算します。要約式はルールで指定できます。タイトルはフォームフィールドまたはカスタムロジックを使用して評価されます。式は、フォームが起動すると実行されます。フォームを事前入力する場合、式はデータが事前入力されてから、または式に使用されている依存するフィールドの値が変更されたときに実行されます。

要約式は通常、アコーディオンレイアウトパネルの子の繰り返し処理に使用され、子パネルごとに意味のあるタイトルを作成します。

適用先:レイアウトがアコーディオンとして設定されているパネルの直接の子であるパネル。

戻り値の型 :数式は、アコーディオンのタイトルとなる文字列を返します。

例: “Account number : “ + textbox1.value

数式の検証

数式の検証は、特定の数式を使ってフィールドを検証するのに使用されます。通常、この式は、フィールドの値と共に正規表現を使用してフィールドの検証を行います。フィールドの値が変更されると、数式はトリガされ、フィールドの検証ステータスは再計算されます。

適用性:フィールド

戻り値の型 :数式は、フィールドの検証ステータスを表すブール値を返します。Falseはそのフィールドが無効であることを表し、trueはそのフィールドが有効であることを表します。

:英国の郵便番号を表すフィールドの検証式は次の通りです:

(this.value && this.value.match(/^(GIR 0AA|[A-Z]{1,2}\d[A-Z0-9]? ?[0-9][A-Z]{2}\s*)$/i) == null) ?false : true

上記の例において、空でない値がパターンに一致しない場合は、数式は、そのフィールドが有効でないことを示すためにfalseを返します。

注意:

必須または必須でないフィールドの検証式を記述する場合、その式はフィールドの視認性ステータスに関わらず評価されます。隠れているフィールドの検証を停止するには、初期化または値コミットスクリプトの検証無効プロパティをtrueに設定します。例えば、this.validationsDisabled=trueというように。

値コミットスクリプト

値コミットスクリプトがトリガされるのは、次のような場合です。

  • ユーザーがUIからフィールドの値を変更した場合。
  • 別のフィールドの値が変更されたため、フィールドの値がプログラムによって変更された場合。

適用先:フィールド

戻り値の型:値コミットスクリプトの数式は値を返しません。数式が値を返した場合、その値は無視されます。

例:commit上のフィールドに入力されたアルファベットを大文字を変換する場合に使用される値コミット式は次の通りです:
this.value=this.value.toUpperCase()

注意:

フィールドの値がプログラムによって変更された場合、値コミットスクリプトを無効にすることができます。無効にするには、http://[server]:[port]/system/console/configMgrに移動して、互換性のあるAdaptive FormsのバージョンAEM Forms 6.1に変更します。以降、値コミットスクリプトは、ユーザーがフィールドの値をUIから変更した場合にのみ実行されます。

表示式

表示式は、フィールド/パネルの視認性を制御するのに使用されます。通常、表示式にはフィールドの値プロパティが使用され、値が変更される度に再トリガされます。

適任性:フィールドおよびパネル

戻り値の型 :数式は、フィールド/パネルが表示されているか否かを表すブール値を返します。falseはフィールドまたはパネルが非表示であることを表し、trueはフィールドまたはパネルが表示されていることを表します。

例:フィールド1の値が男性に設定された場合のみ表示されるパネルの表示式は次の通りです:field1.value == "Male"

ステップ完了の式

ステップ完了の式は、ユーザーがウィザードの次のステップへ進むのを防ぎます。これらの数式は、パネルにウィザードのレイアウト(ワンステップずつ表示するマルチステップフォーム)がある場合に使用されます。ユーザーは、既存セクションの全ての必須の値が入力され、有効である場合のみ、次のステップ、パネルまたはサブセクションに進むことができます。

適用性:ウィザードに設定された項目がレイアウトされたパネル

戻り値の型 :数式は、既存のパネルが有効か無効かを表すブール値を返します。Trueは既存のパネルが有効で、ユーザーが次のステップに移動できることを表します。

:様々なパネルに表示されるフォームでは、次のパネルに移動する前に既存のパネルが検証されます。このような場合、ステップ完了の式を使用します。一般的に、これらの数式にはGuildBridge検証APIが使用されます。ステップ完了の式の一例:
window.guideBridge.validate([],this.panel.navigationContext.currentItem.somExpression)

アダプティブフォームにおける検証

アダプティブフォームにフィールド検証を追加するには複数の方法があります。検証チェックがフィールドに追加された場合、Trueはフィールドに入力された値が有効であることを示します。Falseは値が無効であることを示します。フィールドの中または外にタブを付けた場合、エラーメッセージは生成されません。

フィールドに検証を追加する方法:

必須

コンポーネントの編集ダイアログにおいて、コンポーネントを必須にするには、TitleとText>Requiredのオプションを選択します。また、適切な必須メッセージ(オプション)も追加することができます。

検証パターン

フィールドにはデフォルトの検証パターンが複数あります。検証パターンを選択するには、コンポーネントの編集ダイアログで、パターンセクションを見つけてパターンを選択します。パターンテキストボックスにおいて、独自のカスタム検証パターンを作成できます。検証ステータスは、入力されたデータが検証パターンに適応している場合のみTrueを返し、それ以外の場合はFalseを返します。独自の検証パターンを書き込むには、「HTML5 フォームのパターン形式文字列サポート」を参照してください。

検証式

フィールドの検証は、別のフィールドの式を使って計算することもできます。この数式は、コンポーネントの編集ダイアログにあるスクリプトタブの検証スクリプトフィールドの中で作成されます。フィールドの検証ステータスは、数式が返す値によります。このような数式を作成する方法について詳しくは、「数式の検証」を参照してください。

追加情報

フィールドの表示形式の使用

表示形式は、異なる形式でデータを表示するのに使用されます。例えば、ハイフンが入った電話番号、郵便番号または日付選択を表示するのに、表示形式を使うことができます。表示形式は、コンポーネントの編集ダイアログにあるパターンセクションから選択することができます。上記の検証パターンに類似したパターンをカスタムで作成することも可能です。

GuideBridge - APIとイベント

GuideBridgeは、ブラウザのメモリーモデルにおいてアダプティブフォームを操作するのに使うAPIが集まったものです。Guide Bridge API、クラスメソッド、公開されたイベントに関する詳細の紹介は、アダプティブフォームの JavaScript ライブラリ API リファレンスを参照してください。

注意:

数式でGuideBridgeイベントリスナーの使用は避けることをお勧めします。

様々な数式におけるGuideBridgeの使用方法

  • フォームのフィールドをリセットするには、ボタンのクリック式上のguideBridge.reset()APIをトリガします。同様に、クリック式guideBridge.submit()という送信APIがあります
  • 様々なフィールドおよびパネル間でフォーカスを設定するのにSetFocus ()APIを使用します(パネルフォーカスは自動的に最初のフィールドに設定されます)。setFocus()は、パネル間、前回/次回のトラバーサルのナビゲーション、特定フィールドへのフォーカスの設定など、幅広いオプションを提供します。例えば、次のパネルに移動するには、guideBridge.setFocus(this.panel.somExpression, 'nextItem')を使用します。
  • アダプティブフォームまたはその特定のパネルを検証するには、guideBridge.validate(errorList, somExpression)を使用します。

数式外でのGuideBridgeの使用

GuideBridge APIを数式の外で使用することもできます。例えば、アダプティブフォームをホストしているページHTMLとフォームモデル間の通信を設定するのにGuideBridge APIを使用することができます。また、フォームをホストしているインラインフレームの親から取得した値を設定することもできます。 

GuideBridge APIを上記の例で使用するには、GuideBridgeのインスタンスを取得します。インスタンスを取得するには、bridgeInitializeStartウィンドウオブジェクトイベントを聞きます:

window.addEventListener("bridgeInitializeStart", function(evnt) {

     // get hold of the guideBridge object

     var gb = evnt.detail.guideBridge;

     //wait for the completion of AF

     gb.connect(function (){

        //this function will be called after Adaptive Form is initialized

     })

})

注意:

AEMでは、clientLibでコードを書き込んで、ページに含めておくことをお勧めします(ページのheader.jspまたはfooter.jsp部分)。

フォームを初期化した後(bridgeIntializeCompleteイベントが送出された後)でGuideBridgeを使用するには、ウィンドウguideBridgeを使ってGuideBridgeインスタンスを取得します。guideBride.isConnected APIを使って、GuideBridge初期化ステータスを確認することができます。

GuideBridgeイベント

またGuideBridgeは、ホストページ内の外部スクリプトのために特定のイベントも提供します。外部スクリプトは、これらのイベントを聞いて様々な操作を行います。例えば、フォームのユーザー名が変更される場合は、ページのヘッダー部分に表示される名前も常に変更されます。これらのイベントに関する詳細は、「アダプティブフォームの JavaScript ライブラリ API リファレンス」を参照してください。

次のコードを使ってハンドラーを登録してください:

guideBridge.on("elementValueChanged", function (event, data)  {

      // execute some logic when value of a field is changed  

});

フィールドのカスタムパターンの作成

前述のように、アダプティブフォームでは、作成者が検証または表示形式のパターンを提供することができます。デフォルトパターンの使用に加えて、アダプティブフォームコンポーネントに再利用可能なカスタムパターンを設定することも可能です。例えば、テキストフィールドまたは数値フィールドを設定できます。設定が終われば、特定の種類のコンポーネントのすべてのフォームにおいてこれらのパターンを使用することができます。例えば、テキストフィールドのカスタムパターンを作成して、アダプティブフォームのテキストフィールドで使用することができます。コンポーネントの編集ダイアログでパターンセクションにアクセスすることで、カスタムパターンを選択できます。パターン設定またはフォーマットに関する詳細は、「HTML5 のパターン形式文字列サポート」を参照してください。

特定のフィールドタイプのカスタムパターンを作成して、同じ種類のフィールドに再利用するには、次のステップを実行してください。

 

  1. 自分のオーサーインスタンスで CRXDE Lite に移動します。

  2. カスタムパターンを管理するためのフォルダーを作成します。アプリケーションディレクトリの下で、sling:folderタイプのノードを作成します。例えば、カスタムパターンという名前でノードを作成します。このノードの下で、nt:unstructedというまた別のタイプのノードを作成してtextboxpatternsと名前を付けます。このノードには、追加しておくとよい様々なカスタムパターンが含まれています。

  3. 作成したノードのプロパティタブを開きます。例えば、textboxpatternsのプロパティタブを開きます。このノードにguideComponentTypeプロパティを追加して、その値をfd/af/components/formatter/guideTextBoxに設定します

  4. このプロパティの値は、パターンを設定するフィールドによって変わります。数値フィールドのguideComponentTypeプロパティの値は、fd/af/components/formatter/guideNumericBoxです。日付選択フィールドの値は、fd/af/components/formatter/guideDatepickerです。

  5. textboxpatternsノードにプロパティを割り当てることでカスタムパターンを追加できます。名前の付いたプロパティ(例えば、パターン1)を追加して、追加したいパターンの値に設定します。例えば、Fax=text{99-999-9999999}の値でパターン1のプロパティを追加します。パターンは、アダプティブフォームで使うすべてのテキストボックスで使用可能です。

    CrDeでフィールドのカスタムパターンの作成
    カスタムパターンの作成

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー