フォームの基本的な構造は次のとおりです。
これらはすべて、標準の AEM インストールで利用できるデフォルトの一連のフォームコンポーネントを使用して実現されます。
フォームで使用する新しいコンポーネントを開発するほかに、次のこともできます。
必要に応じて、スクリプトを使用して機能を拡張できます。
フォーム開始コンポーネントには、読み込み元パス(リポジトリ内のノードを指すオプションのパス)を指定するフィールドがあります。
読み込み元パスとは、定義済みの値をフォーム上の複数のフィールドに読み込むために使用するノードプロパティのパスです。
これは、リポジトリ内のノードへのパスを指定するオプションのフィールドです。このノードに、フィールド名と一致するプロパティがある場合、フォーム上の適切なフィールドがそのプロパティの値が設定された状態でプリロードされます。一致が存在しない場合、フィールドにはデフォルト値が使用されます。
フォームアクションで初期値の読み込み元となるリソースを設定することもできます。これには、init.jsp
内で FormsHelper#setFormLoadResource
を使用します。
設定されていない場合にのみ、作成者がフォーム開始コンポーネントに設定したパスからフォームに値が読み込まれます。
様々なフォームフィールドには、項目読み込みパス(リポジトリ内のノードを指すオプションのパス)もあります。
項目読み込みパスとは、定義済みの値をフォーム上の特定のフィールド(ドロップダウンリスト、チェックボックスグループ、ラジオグループなど)に読み込むために使用するノードプロパティのパスです。
ドロップダウンリストは、選択肢の値を提供するように設定できます。
「項目読み込みパス」を使用すると、リポジトリ内のフォルダーからリストにアクセスし、リストの値をフィールドにプリロードできます。
新しい sling フォルダー(sling:Folder
)を作成する
例:/etc/designs/<myDesign>/formlistvalues
ドロップダウンアイテムのリストを格納する複数値文字列タイプ(String[]
)の新しいプロパティ(myList
など)を追加します。コンテンツはスクリプト(JSP スクリプトやシェルスクリプトの curl など)を使用してインポートすることもできます。
「項目読み込みパス」フィールドにフルパスを使用します。
例:/etc/designs/geometrixx/formlistvalues/myList
String[]
内の値が次のような形式の場合
AL=Alabama
AK=Alaska
次のリストが生成されます。
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
この機能は、多言語設定などに適しています。
フォームにはアクションが必要です。アクションでは、ユーザーデータが入力されたフォームが送信されたときに実行する操作を定義します。
標準の AEM インストールに用意されている一連のアクションは、
/libs/foundation/components/form/actions
およびフォームコンポーネントのアクションタイプリストで確認できます。
この節では、このリストに含める独自のフォームアクションを作成する方法について説明します。
/apps
に独自のアクションを追加するには、次の手順を実行します。
sling:Folder
タイプのノードを作成します。実装するアクションを反映した名前を指定してください。
次に例を示します。
/apps/myProject/components/customFormAction
このノードで、次のプロパティを定義し、すべて保存をクリックして、変更を保存してください。
sling:resourceType
- foundation/components/form/action
に設定
componentGroup
- .hidden
として定義
オプション:
jcr:title
- 選択したタイトルを指定します。これは、ドロップダウン選択リストに表示されます。設定されていない場合は、ノード名が表示されます
jcr:description
- 任意の説明を入力します
フォルダーにダイアログノードを作成します。
フォルダーに次のどちらかを作成します。
ポストスクリプト。
スクリプトの名前は post.POST.<extension>
にします(例:post.POST.jsp
)
ポストスクリプトは、フォームが処理のために送信されたときに呼び出されます。フォーム
POST
から受け取ったデータを処理するコードを含めます。
フォームが送信されたときに呼び出される転送スクリプトを追加します。
スクリプトの名前は forward.<extension
(例:forward.jsp
)にします
このスクリプトでは、パスを定義できます。現在の要求が、指定されたパスに転送されます。
必要な呼び出しは、FormsHelper#setForwardPath
(2 つのバリアント)です。通常は、何らかの検証(ロジック)を実行して、ターゲットパスを見つけ、そのパスに転送し、デフォルトの Sling POST サーブレットで JCR への実際の保存を実行できるようにしてください。
また、フォームアクションと forward.jsp
が「グルー」コードとしてのみ動作するような場合には、別のサーブレットで実際の処理を実行することもできます。その例として、/libs/foundation/components/form/actions/mail
にあるメールアクションでは、メールサーブレットが配置されている <currentpath>.mail.html
に詳細を転送します。
まとめると、次のようになります。
post.POST.jsp
は、アクション自体によって完全に実行される小さな操作に便利です。forward.jsp
は、委任のみが必要な場合に便利です。スクリプトは次の順序で実行されます。
フォームのレンダリング時(GET
):
init.jsp
clientvalidation.jsp
clientvalidation.jsp
<form></form>
の内部レンダリング時にaddfields.jsp
フォームの処理時(POST
):
init.jsp
すべてのフィールドの制約に対して:servervalidation.jsp
フォームの validationRT:servervalidation.jsp
forward.jsp
転送パスが設定されていた場合(FormsHelper.setForwardPath
)、リクエストを転送し、その後、cleanup.jsp
を呼び出します
転送パスを設定しなかった場合は、post.POST.jsp
を呼び出します(ここで終了し、cleanup.jsp
は呼び出しません)
再び必要に応じてフォルダーに以下を追加します。
addfields.<extension>
です(例:addfields.jsp
)。addfields
スクリプトは、フォーム開始の HTML が記述された直後に呼び出されます。これにより、カスタム入力フィールドなどの HTML をフォーム内に追加するアクションを実行できます。
初期化スクリプト。
スクリプトの名前は init.<extension>
にします(例:init.jsp
)
このスクリプトは、フォームのレンダリング時に呼び出されます。このスクリプトを使用して、アクションの詳細を初期化できます。
クリーンアップスクリプト。
スクリプトの名前は cleanup.<extension>
にします(例:cleanup.jsp
)
このスクリプトを使用して、クリーンアップを実行できます。
parsys でこのフォームコンポーネントを使用します。これで「アクションタイプ」ドロップダウンに新しいアクションが含まれるようになります。
製品に用意されているデフォルトのアクションは、以下で確認できます。
/libs/foundation/components/form/actions
制約は、次の 2 つのレベルで課すことができます。
(/apps
に)個々のフィールドの独自の制約を追加するには、次の手順を実行します。
sling:Folder
タイプのノードを作成します。実装する制約を反映した名前を指定します。
次に例を示します。
/apps/myProject/components/customFormConstraint
このノードで、次のプロパティを定義し、「すべて保存」をクリックして、変更を保存します。
sling:resourceType
- foundation/components/form/constraint
に設定
constraintMessage
- フォームの送信時に、制約に照らしてフィールドが無効な場合に表示されるカスタマイズされたメッセージ
省略可能:
jcr:title
- 選択したタイトルを指定します。これは選択リストに表示されます。設定されていない場合は、ノード名が表示されますhint
- ユーザーに向けたフィールドの使用方法に関する追加情報このフォルダー内には、少なくとも次のどちらかのスクリプトが必要です。
クライアント検証スクリプト:
スクリプトの名前は clientvalidation.<extension>
です(例:clientvalidation.jsp
)
これは、フォームフィールドをレンダリングすると呼び出されます。このスクリプトを使用すると、クライアントでフィールドを検証するクライアント JavaScript を作成できます。
サーバー検証スクリプト:
スクリプトの名前は servervalidation.<extension>
です(例:servervalidation.jsp
)
これは、フォームを送信すると呼び出されます。このスクリプトを使用すると、フォームの送信後にサーバーでフィールドを検証できます。
サンプルの制約は、以下で確認できます。
/libs/foundation/components/form/constraints
フォームグローバル検証は、開始フォームコンポーネントでリソースタイプを設定することで指定します(validationRT
)。次に例を示します。
apps/myProject/components/form/validation
その後、以下を定義できます。
clientvalidation.jsp
- フィールドのクライアント検証スクリプトの後に挿入されます。servervalidation.jsp
- POST
時の個々のフィールドのサーバー検証後に呼び出されます。フォーム内の他のフィールドの値に応じてフォームコンポーネントの表示と非表示が切り替わるようにフォームを設定できます。
フォームフィールドの表示の変更は、フィールドが特定の条件のみで必要となる場合に便利です。例えば、フィードバックフォームで、顧客に電子メールで製品情報を送信してよいかを尋ねて、顧客が「はい」を選択すると、顧客が電子メールアドレスを入力できるテキストフィールドが表示されるような場合です。
フォームコンポーネントを表示または非表示にする条件を指定するには、表示 / 非表示のルールを編集ダイアログボックスを使用します。
ダイアログボックスの最上部にあるフィールドを使用して、次の情報を指定します。
1 つ以上の条件がこれらのフィールドの下に表示されます。条件では、ある値に対して、同じフォーム上の別のフォームコンポーネントの値が比較されます。フィールドの実際の値が条件を満たした場合に、条件が真と評価されます。条件には以下の情報が含まれます。
例えば、タイトル Receive email notifications?
* * を持つラジオグループコンポーネントは Yes
および No
ラジオボタンを含みます。「Email Address
」というタイトルのテキストフィールドコンポーネントは、次の条件を使用しているので、「Yes
」を選択した場合に表示されます。
JavaScript の場合、条件にはエレメント名プロパティの値を使用して、フィールドを参照します。前述の例では、ラジオグループコンポーネントのエレメント名プロパティは「contact
」です。次のコードは、前の例と同等の JavaScript コードです。
((contact == "Yes"))
フォームコンポーネントを表示または非表示にするには:
特定のフォームコンポーネントを編集します。
「表示 / 非表示」を選択して、表示 / 非表示のルールを編集ダイアログを開きます。
最初のドロップダウンリストで、「表示」または「非表示」を選択して、条件に応じてコンポーネントを表示するか、非表示にするかを指定します。
一番上の行の末尾にあるドロップダウンリストで、次のどちらかを選択します。
条件行で(デフォルトとして 1 つだけ表示されます)、コンポーネントと演算子を選択し、値を指定します。
必要に応じて、「条件を追加」をクリックして、条件を追加します。
次に例を示します。
「OK」をクリックして、定義を保存します。
定義を保存すると、フォームコンポーネントプロパティの「表示 / 非表示」オプションの横に「ルールを編集」リンクが表示されます。そのリンクをクリックすると、表示 / 非表示のルールを編集ダイアログボックスが開いて、変更できます。
「OK」をクリックして、すべての変更を保存します。
表示/非表示の定義の効果は、以下で確認およびテストできます。
オーサー環境のプレビューモード(最初にプレビューに切り替えるときに、ページをリロードする必要があります)
パブリッシュ環境
表示/非表示の条件では、エレメント名プロパティの値を使用して、フォーム内の他のコンポーネントを参照します。いずれかの条件で、削除されたコンポーネントまたはエレメント名プロパティが変更されたコンポーネントを参照している場合、表示/非表示の設定は無効になります。その場合は、手動で条件を更新する必要があります。更新しないと、フォームの読み込み時にエラーが発生します。
表示/非表示の設定が無効な場合、その設定は JavaScript コードとしてのみ提供されます。コードを編集して、問題を修正します。そのコードでは、コンポーネントを参照するために元々使用していたエレメント名プロパティを使用しています。
スクリプトを記述する際に使用できる API エレメントについて詳しくは、フォームに関連する javadoc を参照してください。
これは、フォームが送信される前にサービスを呼び出し、呼び出しに失敗した場合にサービスをキャンセルするなどのアクションに使用できます。
検証リソースタイプを定義します。
検証用のスクリプトを含めます。
com.day.cq.wcm.foundation.forms.ValidationInfo
オブジェクトを作成します。エラーが発生した場合、フォームデータはポストされません。