アダプティブフォームのエラーメッセージのレイアウトと位置をカスタマイズ customize-layout-and-positioning-of-error-messages-of-an-adaptive-form

スタイル ​モードでフォームを開きます。スタイルモードでフォームを開くには、ページツールバーで ／スタイル ​を選択します。

フォームオブジェクト ​の下のサイドバーで、フィールドを選択し、編集ボタン を選択してください。

カスタマイズするフィールドの状態を選択し、その状態のスタイル設定を指定します。

フォームを編集モードで開きます。

編集モードで、コンポーネントを選択し、 ／ドキュメントコンテナ ​をクリックしてから、 を選択します。

アダプティブフォームテーマのサイドバーで、テーマエディターで作成したテーマを選択します。

CRXDE Lite を開きます。デフォルトの URL は https://'[server]:[port]'/crx/de です。

/libs/fd/af/layouts/field ノードからフィールドレイアウト（例えば、defaultFieldLayout）を /apps ノード（例えば、/apps/af-field-layout）にコピーします。

コピーしたノードの名前と defaultFieldLayout.jsp ファイルの名前を変更します。例えば、errorOnRight.jsp。

コピーしたノードの qtip および jcr:description プロパティの値を変更します。例えば、プロパティの値を「Error On Right」に変更します。

新しいスタイルおよび動作を追加するには、/etc ノードでクライアントライブラリを作成します。

例えば、/etc/af-field-layout-clientlib で、ノード client-library を作成します。値 af.field.errorOnRight を持つカテゴリプロパティと、次のコードを持つ style.less ファイルを追加します。

.widgetErrorWrapper {

 height: 38px;
 margin: 5px;

 .guideFieldWidget{
 width: 60%;
 float: left;
 }

 .guideFieldError{
 overflow:hidden;
 width:40%;
 }

}

外観と動作を向上するには、レイアウトファイル内で作成したクライアントライブラリを含めます（errorOnRight.jsp）。

フィールドの編集ダイアログを開き、「スタイル」タブを選択します。フィールドレイアウトを設定 ​ドロップダウンボックスで、新しく作成したレイアウトを選択し、「OK」をクリックします。