「フォーム」モデルは、フォームの作成、投稿(コンタクト)の受付、メールによる通知などを管理します。ヘッダメニューの「コミュニケーションアイコン コニュニケーション」から各オブジェクトにアクセスできます。
| モデル | 説明 |
|---|---|
| フォーム | 「設問」をグループ化したものがフォームになります。またフォームの各種設定を管理します。 |
| 設問 | フォームの各設問を作成・管理します。 |
| 設問タイプ | 「設問」の雛形を管理します。システムでのみ管理できます。ワークスペース内では作成できません。 |
| コンタクト | フォームから投稿されたデータを管理します。 |
「設問」の作成
- システムまたはワークスペースで、「コミュニケーションアイコン コミュニケーション」メニューから「設問」を選択し、新規作成をクリックします。
- 「ラベル」を入力し、必要に応じて「説明」を入力します。「ラベル」は表示されるフォームの入力コントロールのラベルとなります。
- 「設問タイプ」を選択し、適用をクリックします。
- 各項目を設定します。
| 設定項目名 | 説明 |
|---|---|
| ラベル | フォームの設問名(ラベル)を入力します。 |
| 説明 | 一覧画面での識別用の設問の説明を入力します。 |
| プライマリ | 設問のうち、チェックのある最初のプライマリ指定の設問への回答が、コンタクトの一覧画面・編集画面の「プライマリ」欄に格納されます。 |
| 必須項目 | 設問を必須項目にする場合、チェックします。 |
| 集計する | 投稿された「コンタクト」の一覧画面から集計する際に集計対象とする項目の場合チェックします。 |
| メールには情報を含めない | 管理者への通知メールに含めたくない場合(個人情報など)、チェックします。 |
| ヒント | 入力コントロールの下に表示されます。 |
| バリデーション | 入力チェックを行う場合、バリデーションタイプを選択します。 |
| 正規化 | normalizer_normalize関数を使って値を正規化します(全角英数字を半角に揃える等)。正規化方式は「Normalizer::NFKD」です。 http://php.net/manual/ja/normalizer.normalize.php |
| フォーマット | Sprintf関数を使って文字列をフォーマットする時に指定します。 複数の値を受け取る設問の時は、カンマ区切りで指定します(日付の時、「%04d,%02d,%02d」など)。 http://php.net/manual/ja/function.sprintf.php |
| テキスト長 | 最大入力可能な文字数を指定します。 |
| マルチバイト | 入力文字数をマルチバイト文字でカウントします。 |
| 最大サイズ | 「添付ファイル」の時、ファイルの最大サイズを指定します。 |
| コネクタ | 複数の値を受け取る時、入力値で値を連結します(「,」など)。 |
| 複数の値 | 複数の値を受け取る時、チェックします。 |
| オプション | ラジオボタンやチェックボックス、ドロップダウンの選択肢をカンマ区切りで指定します。設問タイプが「添付ファイル」の時は、受け付けるファイルの拡張子を指定します。 |
| 値 | 「オプション」に指定した値を別の値を受け取る時、「オプション」に対応する値をカンマ区切りで指定します。 |
| 初期値 | 初期値を指定します。複数の値を選択済みにする時は、カンマ区切りで指定します。 |
| ベースネーム | システム、ワークスペース内でユニークな英数文字列を指定します。 |
設問のバリデーション
設問のバリデーション欄では標準で以下のバリデーションが選択可能です。
| バリデーション | 説明 |
|---|---|
| メールアドレス | 半角英数字記号で構成されたメールアドレスかをチェックします。 |
| メールアドレス (確認) | 半角英数字記号で構成されたメールアドレスかをチェックします。設問タイプ「メールアドレス (確認)」に対して利用します。 |
| 電話番号 | 半角数字で構成された電話番号かをチェックします。区切り文字（ 半角ハイフン「-」、半角括弧「( )」 ）の有無は問いません。 |
| 郵便番号 | 半角数字で構成された郵便番号かをチェックします。区切り文字（ 半角ハイフン「-」 ）の有無は問いません。 |
| URL | 半角英数字記号で構成された URL かをチェックします。 |
| 日付 | 半角数字で構成された妥当な日付かをチェックします。 |
| 日付と時刻 | 半角数字で構成された妥当な日時かをチェックします。 |
| ひらがな | ひらがなのみかをチェックします。 |
| カタカナ | カタカナのみかをチェックします。環境変数「validation_katakana_unicode」の影響を受けます。 |
| 数値 | 半角数字のみかをチェックします。 |
| 半角英数記号 | 半角英数記号のみかをチェックします。 |
| 選択項目 | 設問の「値」欄に設定した選択肢と一致するかをチェックします。「値」欄が未設定の場合は「オプション」欄の選択肢でチェックします。 |
| パスワード | パスワードに関する環境変数の設定に照らし合わせたチェックをします。設問タイプ「パスワード」に対して利用します。 |
「フォーム」の作成
- 「コミュニケーションアイコン コミュニケーション」メニューから「フォーム」を選択し、一覧画面から「新しいフォーム」を選択します。
- 設問の「追加...」ボタンをクリックし、作成済みの「設問」を選択します。
- ドラッグ&ドロップで、設問の表示順を設定します。
- フォームのオプションを設定します。
| 設定項目名 | 説明 |
|---|---|
| スパム対策 | 「トークンを有効にする」をチェックし、「トークン有効期限」を設定すると、投稿にトークンを必要とするようになります。「添付ファイル」タイプの設問を含む場合、この項目を必ず指定してください。 |
| 通知メールを送信 | 投稿者へのThanksメール、管理者への通知メールを送信する場合、チェックします。 |
| リダイレクト先 | 投稿を受け付けた後に遷移するThanksページのURLを指定します。以下のフォームのビューでは、ThanksページのURLに「?submit=1」を付与して、その値で表示を分岐しています。 <mt:if name="request.submit"><p>お問い合わせありがとうございました。メールにてご連絡いたしますのでしばらくお待ち下さい。</p></mt:if> |
| メールのFrom | Thanksメール、通知メールのFromアドレスを指定します。省略した場合、システムのメールアドレスがFromアドレスとなります。 |
| 送信者にメールを送る/ビュー | Thanksメールを送信する場合、チェックし、メールテンプレートを選択します。ビューの選択ドロップダウンには、クラス「メール」を指定したビューが表示されます。ビューを選択した時、ビューの「件名」フィールドの値がメールの件名となります(件名フィールドでは、テンプレート・タグが利用可能です)。ビューの指定がない場合、tmpl/email/form_thanks.tmpl が利用されます。 |
| 管理者に通知メールを送る/ビュー | 管理者に通知メールを送信する場合、チェックし、メールテンプレートを選択します。ビューの選択ドロップダウンには、クラス「メール」を指定したビューが表示されます。ビューを選択した時、ビューの「件名」フィールドの値がメールの件名となります(件名フィールドでは、テンプレート・タグが利用可能です)。ビューの指定がない場合、tmpl/email/form_notify.tmpl が利用されます。 |
フォームの「ビュー」と「URLマップ」の作成
続いて、フォームのビューとURLマップを作成します。以下は「Website」テーマのフォームモジュールです。
<div class="container-fluid">
<mt:if name="request.__mode" eq="submit">
<mt:if name="error">
<p class="text-center text-danger"><mt:trans phrase="An error occurred." language="$language"></p>
<mt:loop name="errors">
<mt:if name="__first__"><ul></mt:if>
<li><mt:var name="__value__"></li>
<mt:if name="__last__"></ul></mt:if>
</mt:loop>
<mt:else>
<p class="text-center"><mt:trans phrase="Thank you for your inquiry." language="$language"></p>
</mt:if>
<mt:elseif name="request.submit" eq="1">
<p class="text-center"><mt:trans phrase="Thank you for your inquiry." language="$language"></p>
<mt:else>
<mt:if name="error">
<p class="text-center"><mt:trans phrase="Please check your entries." language="$language"></p>
<mt:loop name="errors">
<mt:if name="__first__"><ul></mt:if>
<li><mt:var name="__value__"></li>
<mt:if name="__last__"></ul></mt:if>
</mt:loop>
<mt:else>
<mt:if name="confirm_ok">
<p class="text-center"><mt:trans phrase="Confirm the following and click Submit button." language="$language"></p>
<mt:else>
<p class="text-center"><mt:trans phrase="Please complete the form below and click Confirm button." language="$language"></p>
</mt:if>
</mt:if>
</div>
<form action="<mt:formpermalink>" method="POST" enctype="multipart/form-data">
<input type="hidden" name="form_id" value="<mt:formid>">
<input type="hidden" name="__mode" value="<mt:if name="confirm_ok">submit<mt:else>confirm</mt:if>">
<input type="hidden" name="_type" value="form">
<input type="hidden" name="_language" value="<mt:var name="language">">
<input type="hidden" name="_identifier" value="<mt:if name="request._identifier"><mt:var name="request._identifier" escape><mt:else><mt:var name="form_identifier"></mt:if>">
<input type="hidden" name="object_id" value="<mt:if name="request.object_id"><mt:var name="request.object_id" escape><mt:else><mt:var name="current_object_id"></mt:if>">
<input type="hidden" name="model" value="<mt:if name="request.model"><mt:var name="request.model" escape><mt:else><mt:var name="current_archive_model"></mt:if>">
<input type="hidden" name="magic_token" value="<mt:var name="magic_token" escape>">
<table class="table table-hover table-striped form-table">
<tbody>
<mt:formquestions>
<mt:objectcontext model="question" prefix="question">
<mt:questiontemplate eval="1">
</mt:objectcontext>
<mt:if name="__last__">
<tr>
<td colspan="2" class="text-center">
<button type="submit" class="btn btn-secondary btn-lg"><mt:if name="confirm_ok"><mt:trans phrase="Submit" language="$language"><mt:else><mt:trans phrase="Confirm" language="$language"></mt:if></button>
</td>
</tr>
</mt:if>
</mt:formquestions>
</tbody>
</table>
</form>
</mt:if>入力画面への戻るボタン
確認画面から入力画面へ遷移するには、__mode パラメータを「submit」「confirm」以外に設定して form をサブミットしてください。
例： <input type="hidden" name="__mode" value="edit">
<mt:if name="confirm_ok">
<button id="form-back-button" type="submit" class="btn btn-outline-secondary mb-2"><mt:trans phrase="Back" language="$language"></button>
<script>
document.querySelector('#form-back-button' ).addEventListener('click', function (e) {
this.form.querySelector('input[name="__mode"]').value = 'edit';
});
</script>
</mt:if>URLマップの作成
ビューを作成したら、対応するURLマップを作成します。URLマップについては「アーカイブ設定について」を参照してください。
| 設定項目名 | 説明・値 |
|---|---|
| 名前 | 任意の名前を指定します。例: フォーム |
| モデル | 「フォーム」 |
| URLマップ | 公開するURLを指定します。例:forms/<mt:formbasename>.html |
| コンテナ | 指定なし |
| ビュー | 作成したフォームのビューを指定します。例「フォーム」 |
| 日付ベース | 指定なし |
| ファイル出力 | ダイナミック(※ダイナミック・パブリッシングでPOSTリクエストに対してpt-view.phpへのリライトを設定している場合、静的でも問題ありません) |
最後に、フォームを再構築して、投稿できることを確認してください。
コンタクト(投稿されたデータ)の管理
- コンタクト (フォームへの投稿) の管理 のページを参照してください。