フォーム・フラグメントの作成

liferay 7.4 U45+/GA45+.

フォームコンポーネントの断片 は、コンテンツページでオブジェクトのフォームを構築するためのものです。 Liferayのフォームフラグメントがあなたのユースケースを満たさない場合は、フォームに必要なデザインと機能を実現するために独自のフォームフラグメントを作成してください。

フォームの断片を作る

1. サイトメニュー()を開き、 デザイン → フラグメント に移動します。

2. プラス()をクリックして、フォームのフラグメントを整理するためのフラグメントセットを作成します。

3. Add() をクリックし、 Form Fragment タイプを選択し、 Next をクリックします。

   

4. 名前を入力します。

5. フラグメントで許可するフィールドタイプを選択します。

   CAPTCHAを選択した場合、他のフィールドタイプを選択することはできません。 それ以外の場合は、どのフィールドの組み合わせでも選択できる。

   

6. 追加 をクリックする。 これにより、ドラフトフラグメントが作成され、フラグメントの編集ページに移動します。

7. コードタブで、フラグメントのHTML、CSS、JavaScriptを追加します。

   

   note

   サブミットボタンのテキストは、 マッピング設定 を使ってマッピングできます。

   リダイレクトのために リンク設定 を持つボタンを作成するには、type="button" をボタンの断片に追加します。

8. (オプション）Configuration タブで、JSON を使用してフラグメントを構成し、オプションを追加します。 さまざまなフラグメント・コンフィギュレーション・タイプの詳細については、 フラグメント設定タイプのリファレンス 。

   

9. ［公開］ をクリックします。

次に、フォーム・フラグメントを使ってコンテンツ・ページにフォームを作成します。 詳しくは フラグメントでフォームを構築する を参照してください。

フラグメントツールキットを使用する場合は、yarn run add-fragmentを実行する際にフラグメントの種類を選択することができる。

サポートするフィールドタイプを指定するには、fragment.json の typeOptions に fieldTypes プロパティを追加する。 フィールド・タイプを配列として入力する：

{
   "fragmentEntryKey": "numeric-input",
   "icon": "number",
   "type": "input",
   "typeOptions": {
      "fieldTypes": [
         "number",
         "text"
      ]
   }
}

その後は、基本的なフラグメントを作成するときと同じプロセスを踏む。 基本的なフラグメントの作成とデプロイについては、 Using Fragments Toolkit を参照してください。

サポートされるフィールド・タイプ リファレンス

フォーム・フラグメントで input 変数を使う

フォームフラグメントには input 変数が含まれており、各フラグメントの JavaScript と FreeMarker のコードで使用します。 この変数には、フラグメントを設定するためのプロパティが格納される。

入力変数のプロパティのリファレンス

入力 file の属性

入力 number の属性

入力 number の属性

入力 select の属性

関連トピック

ページ・フラグメントの開発

フラグメントを使ってフォームを構築する