登録フォームブロックのソース設定
機能概要
フォームブロックの設定方法を「ソース設定」にすることでhtmlでコンテンツ作成/編集ができます。
機能仕様
・各フィールドのhtmlはThymeleaf記法で記述されます。Thymeleafに関してはこちらをご参照ください。
※ビジュアル設定になっているフォームブロックをソース設定に変更することは可能ですが、一度ソース設定にしたフォームブロックをビジュアル設定に変更することはできません。
UI
1. フォームブロック作成モーダル
フォームブロックを新規で作成する際、設定方法から「ソース設定」を選択します。
フィールド選択
使用するフィールドの設定画面が表示されますので、追加したいフィールドは右、除外したいフィールドを左に移動してください。
参照フィールド設定
使用するフィールドに参照フィールドが含まれる場合、参照フィールドのキーフィールドと認証フィールドを設定します。
キーフィールドとは
参照フィールドを指定する際に参照先DBのレコードを識別するためのフィールドです。
キーフィールドは入力項目としてフォームに追加されます。
ソースを編集しPHPやAPIを使用することで参照先DBのレコード値をプルダウンで表示し選択させることも可能です。詳細はサンプルプログラムをご参照ください。
キーフィールドに指定できるフィールド
| １レコード参照の場合 | 参照先DBのレコードID、参照先DBのテキストフィールド(必須かつユニーク) |
|---|---|
| 複数レコード参照の場合 | 参照先DBのレコードID |
認証フィールドとは
参照フィールドを指定する際に、キーフィールドの完全一致だけで関連付けされることを避けたい場合に使用するフィールドです。
認証フィールドは入力必須項目としてフォームのキーフィールドの下に追加されます。
認証フィールドに指定できるフィールド
| １レコード参照の場合 | キーフィールド以外の参照先DBのテキストフィールド、メールアドレスフィールド、電話番号フィールド |
|---|---|
| 複数レコード参照の場合 | 設定不可 |
フィールド設定
入力コントロールやデフォルト値を設定します。
フィールド設定に問題が無ければ作成ボタンをクリックします。
※ 使用するフィールドタイプがセレクト、日時、日付、月日、時刻フィールドの場合、入力コントロールの選択が可能です。
※［年/月/日］、［月/日］、［時:分:秒］はゼロ埋めの有無に対応。
※［年/月/日］や［月/日］の区切り文字は、「/」、「-」に対応。
※［時:分:秒］の区切り文字は、「:」に対応。また、秒の入力は省略可能。
| フィールドタイプ | 選択可能な入力コントロール |
|---|---|
| セレクト |
ラジオボタン プルダウン |
| 日時 |
［年］/［月］/［日］ ［時］:［分］:［秒］ ［年/月/日］［時:分:秒］ |
| 日付 |
［年］/［月］/［日］ ［年/月/日］ |
| 月日 |
［月］/［日］ ［月/日］ |
| 時刻 |
［時］:［分］:［秒］ ［時:分:秒］ |
※使用するフィールドタイプが参照フィールドの場合、デフォルト値の選択が可能です。
デフォルト値には「引用（認証レコード値）」「引用（任意レコード値）」が選択できます。
2．フォーム設定画面
ソース設定の場合、フォームタブからフォームの編集が行えます。
左メニューから各ステップのHTMLを切り替えることができます。
コンテンツ：入力ステップ/確認ステップ
フォームの入力ステップページ/確認ステップページのソースが編集できます。
フィールドパーツ追加
フォームにフィールドを追加したい場合に、左上の＋ボタンから「フィールド」をクリックすると、フィールドパーツ追加モーダルが表示されます。
入力ステップの場合、フィールド一覧から追加したいフィールドを右に移動してください。
確認ステップの場合、「＋」ボタンから追加したいフィールドを選択してください。
フィールド追加で参照フィールドを選択した場合、参照フィールド設定モーダルが表示されます。
セレクトや日時、日付、月日、時刻フィールドの入力方法等、入力方法などによりThymeleafの記述が異なる場合には、挿入時に入力コントロールを指定します。
入力ステップ、確認ステップで使用する参照フィールドについて
入力ステップで参照フィールドを使用する際、「参照先DBのレコード公開範囲設定」と「レコード公開範囲による入力制限」の設定状態により、確認ステップに追加できる参照先DBのフィールド追加可否や表示される値の挙動が異なります。
| 参照先DBのレコード公開範囲設定 |
参照先DBレコード公開範囲による入力制限 |
参照先DBのレコード公開範囲の除外 | 確認ステップへの参照先DBフィールドの追加 | 入力ステップで入力する値 | 確認ステップで表示される値 |
| あり | 制限する | 不可 | 可 |
参照フィールドのキーフィールド値（レコード公開範囲内） |
参照フィールドに入力した値と一致する参照先DBのレコード値 |
| 制限する | 不可 |
参照フィールドのキーフィールド値（レコード公開範囲外） ※1,2 |
－ |
||
| 制限しない | 可 | 参照フィールドのキーフィールド値（レコード公開範囲内） | 参照フィールドに入力した値と一致する参照先DBのレコード値 | ||
| 制限しない | 可 |
参照フィールドのキーフィールド値（レコード公開範囲外） |
入力したキーフィールド値 ※3 |
||
| なし | 設定不可 |
－ |
参照先DBのレコードID or 参照先DBのテキストフィールド(必須かつユニーク)のみ追加可 | 参照先DBに存在するキーフィールド値 | 入力したキーフィールド値 |
※1 入力ステップで使用する参照フィールドの参照先DBに対してレコード公開範囲を設定する場合、「参照先DBレコード公開範囲による入力制限 」を「制限する」にすることで、入力ステップでレコード公開範囲外の参照先レコードの値を入力されても登録できないように制限できます。
※2 参照先DBレコード公開範囲による入力制限を「制限する」で設定する場合、レコード公開範囲外の値を入力すると入力エラーとして次のステップへ遷移できません。
※3 システムフィールドを除く参照先DBのフィールドの値には、入力したキーフィールド値が表示されます。
引用値表示パーツ
ソース設定では、以下のいずれかの条件に当てはまる場合、引用値表示パーツが追加できます。
・設置認証エリアを指定している
・登録先DBに、レコード公開範囲が設定されているDBを参照している参照フィールドが存在する
認証レコード値やクエリパラメータ指定レコード値を引用してフォーム上で表示することができます。
「引用値表示パーツ」をクリックすると、引用値表示パーツ追加モーダルが表示されます。
引用元では「認証レコード引用」と「クエリパラメータ引用」のいずれかを選択、フィールドからは引用DB内のフィールドを選択し追加ボタンをクリックします。
引用元の設定
| 引用元 | 認証レコード引用 |
設置認証エリアを指定している場合選択できます。 フォーム上に認証DB内のレコード値を引用表示します。 認証DBにレコード公開範囲を設定済みのDBを参照している参照フィールドが存在する場合、参照先DBのフィールドの値を追加、表示することができます。 |
|---|---|---|
| クエリパラメータ引用 |
登録先DBにレコード公開範囲が設定されているDBを参照している参照フィールドが存在する場合選択できます。 フォーム上に参照先DB内のレコード値を引用表示します。 |
引用値表示パーツとして使用する参照先DBのフィールドについて
※1 レコード公開範囲で設定済みのDBを参照している参照フィールドのみ選択可能です。
参照先DBのフィールド値は参照先DBのレコード公開範囲の設定内容が適用されます。
※2 参照先DBのレコード公開範囲の条件を満たさない、または、参照先レコードが非公開の場合は、参照先レコードのレコードID以外の値は、null表示です。
※3 参照先レコードのフィールド値がnullの場合は、「値なし」と表示されます。
※4 参照先DBのレコード公開範囲が未指定の場合、引用値表示パーツに参照先DBのフィールドが表示されません。
※5 追加可能なフィールドタイプは、参照フィールドの参照レコード数の設定によって異なります。
| 1レコード参照 |
参照先DBの日時、ファイル、パスワード、参照先DB内で使用する参照フィールドを除くフィールド全般、レコードID、作成日時、最終更新日時 |
|---|---|
| 複数レコード参照 |
参照先DBのテキストエリア、マルチセレクト、日時、ファイル、パスワード、参照先DB内で使用する参照フィールドを除くフィールド全般、レコードID、作成日時、最終更新日時 |
複数ステップ設定
ステップ設定から入力ステップ、確認ステップを追加することができます。
アンケートフォーム等でアンケート入力と個人情報入力でページを分けたいとき等にご利用いただけます。
詳細は複数ステップ設定をご参照ください。
郵便番号住所自動補完
入力ステップのフィールド一覧の設定において、入力コントロールを郵便番号に設定しているテキストフィールドに対して、フォームに入力された日本の郵便番号から紐づく住所情報を自動で入力補完する設定ができます。
詳しくはサイトの郵便番号住所自動補完をご参照ください。
メールアクション
フォームから登録を行った後、サンキューメールや通知メールを送信することができます。
詳しくはメールアクションをご参照ください。
自動登録
フォームブロックから登録を行った際、認証レコード値やURLクエリパラメータで引き継がれた値をフォームからDBへ自動登録させたり、
予め指定した値をDBへ自動登録することができます。詳細は、自動登録の値タイプを参照ください。
完了
入力/確認ステップページと同様に完了ページの作成ができます。
また、左メニューの歯車アイコンから完了時の動作を設定できます。別ページへのリダイレクト設定も可能です。
詳しくは完了ステップをご参照ください。
締切
フォーム登録の登録上限数や登録期間（開始、終了）を設定できます。
詳しくはフォーム締切設定をご参照ください。
エラー
他ステップページと同様にHTMLタグでエラーページの作成ができます。
詳しくはエラーステップをご参照ください。
フィールド一覧
フィールド一覧からフォームで使用しているフィールドの一覧が表示されます。
各フィールドをクリックで個別のフィールド設定変更モーダルが開きます。
| ラベル |
フォーム上に表示されるフィールド名を編集できます。 DBフィールド表示名を参照：DBで設定したフィールド名を表示します。 個別指定：DBで設定したフィールド名とは別に、フォーム上で表示するフィールド名を指定できます。 |
|---|---|
| name属性 |
name属性を任意の値に変更し、ソースに出力することができます。 ※「フォーム」タブのHTMLソース上でフィールドのname属性が識別名（name="fXX"）になっている場合、 HTMLソースの編集が必要です。詳細はこちらをご覧ください。 |
| フォーム必須 |
フォーム上で入力必須か任意かを変更できます。 ※テキストフィールドにデフォルト値の自動生成を設定している場合、DB側で入力必須になっていても入力必須の設定を無しに変更し、使用フィールドに含めない設定ができます。詳細はフィールドのデフォルト値を参照ください。 |
|
入力コントロール （テキストフィールドのみ） |
テキスト：改行が必要ではないテキストデータを入力できます。 郵便番号(JP)：日本の郵便番号フォーマットである「半角数字3桁-半角数字4桁」もしくは「半角数字7桁」を入力できます。 ※「半角数字3桁-半角数字4桁」の場合に使用するハイフンは半角のみ対応。 |
|
郵便番号住所自動補完 （テキストフィールドのみ） |
入力コントロールに郵便番号(JP)を選択した場合、フォームに入力された日本の郵便番号から紐づく住所情報を自動で入力補完する設定ができます。詳しくはサイトの郵便番号住所自動補完をご参照ください。 |
|
キーフィールド 認証フィールド 参照先DBレコード公開範囲による入力制限 （参照フィールドのみ） 参照先レコード値による登録制限 （参照フィールドのみ） |
キーフィールド：参照フィールドを指定する際に、参照先DBのレコードを識別するためのフィールドです。 ※キーフィールドを変更したい場合はフィールドを追加し直してください。
認証フィールド：参照フィールドを指定する際に、キーフィールドの完全一致だけで関連付けされることを避けたい場合に使用するフィールドです。 入力コントロール：認証フィールドを指定する方法として、一時入力かフォームで使用する他フィールドの入力値を使用するか選択できます。
参照先DBレコード公開範囲による入力制限：制限すると、レコード公開範囲設定で公開されているレコードのみがこの参照フィールドに登録できるようになります。
参照先レコード値による登録制限：参照先レコード値による登録制限有無を設定できます。
|
| ヘルプテキスト | 入力時の注意や追記事項などに使用できます。 |
|
入力制限 （テキスト、テキストエリア、メールアドレス、マルチセレクト、整数、数値、電話番号、ファイル、パスワードフィールドのみ） |
入力可能な値を指定して制限できます。 各フィールドで制限できる内容は「フィールドタイプリファレンス」をご確認ください。 |
| エラーメッセージ |
フォームページに表示されるエラーメッセージが編集できます。 未入力の場合にはシステム上のデフォルトのエラーメッセージが表示されます。 |
|
確認入力 （メールアドレス、パスワードフィールドのみ） |
メールアドレスやパスワードフィールドの確認入力欄の有無を選択できます。
HTMLでの表示例
|
|
未選択ラベル 項目ラベル （セレクト/マルチセレクト フィールドのみ） |
未選択ラベル：セレクトフィールド未選択時のラベルの編集ができます。 項目ラベル：DBで設定したラベルの表示を変更したいときに使用します。 ※変更したラベルはフォームページでの表示のみ適応されます。 使用例：表示ラベルを英語に変更
|
|
日時/日付/月日/時刻制限（日時、日付、月日、時刻フィールドのみ） |
フォーム上で入力可能な最小値/最大値を指定して制限できます。 ※空白(null)で設定すると制限なしになります。 ※DB側のフィールドに入力制限を設定している場合、DBで設定した入力制限範囲内で、 フォーム上で入力可能な最小値/最大値を指定して制限することができます。 |
|
タイムゾーン設定 （日時フィールドのみ） |
日時フィールドで扱うタイムゾーンを設定できます。
固定：指定したタイムゾーンの時間帯で扱います。 フォーム上で選択：フォーム上でタイムゾーンを選択できるようにします。 |
|
DBフィールド表示名 |
DB上で設定しているフィールド表示名を確認することができます。 |
|
DBフィールド識別名 |
DB上で設定しているフィールド識別名を確認することができます。 |
|
DBフィールドタイプ |
フィールドタイプを確認することができます。 |
|
DB必須 |
DB側で入力必須制限が設定されているか確認することができます。 |
|
DBデフォルト値 |
DB側で設定しているデフォルト値の設定内容を確認することができます。 |
CSS/JS
CSS
設定したCSSは登録フォームブロックのCSSに適用されます。
設定したCSSは「共通ソースCSS/JavaScript」「ページのCSS/JavaScript」より後に読み込まれます。
詳細はこちらをご確認ください。
JS
設定したJavaScriptは登録フォームブロックのJavaScriptに適用されます。
設定したJavaScriptは「共通ソースCSS/JavaScript」「ページのCSS/JavaScript」より後に読み込まれます。
詳細はこちらをご確認ください。
共通設定
各フィールドで表示されるラベルや入力内容に不備があった場合に表示されるエラーメッセージを設定できます。
また、予め作成したデフォルトメッセージ設定の設定内容を適用することができます。
