スニペット"FormLister"：ログインフォームの実装

ログインフォームの実装するには、次のようなコードで実装できます。

※ あくまで実装例であり、使用するパラメーターや設定値などは参考程度のものです。

[!FormLister?
									&controller=`Login`
									&formid=`login`
									&rules=`{
									"username" : {
										"required" : "ユーザー名を入力してください。"
									},
									"password" : {
										"required" : "パスワードを入力してください。"
									}
								}`
									&formTpl=`@CODE:
								<form method="post">
									<input type="hidden" name="formid" value="login">

<dl>
										<dt><label for="field-username">ユーザー名</label></dt>
										<dd class="[+username.requiredClass+]">
											<input name="username" value="[+username.value+]" id="field-username">
											[+username.error+]
										</dd>
										<dt><label for="field-password">パスワード</label></dt>
										<dd class="[+password.requiredClass+]">
											<input type="password" name="password" id="field-password">
											[+password.error+]
										</dd>
									</dl>

<p class="rememberme"><input type="checkbox" name="rememberme" value="1" id="field-rememberme"><label for="field-rememberme">次回からログインを省略</label></p>

[+form.messages+]

<button>ログイン</button>
								</form>`
									&errorTpl=`@CODE:<p class="error-message">[+message+]</p>`
									&requiredClass=` required`
									&messagesOuterTpl=`@CODE:<p class="error-messages">[+messages+]</p>`
									&successTpl=`@CODE:<div class="complete">ログインに成功しました。</div>`
									&skipTpl=`@CODE:<div class="skip">既にログイン済みです。<br><a href="[(base_url)][~[*id*]~]?logout">ログアウト</a></div>`
								!]

サンプルコード上で使用されているパラメーターについては次の通りです。

パラメーター	説明
&controller	Loginを指定することでログインするためのフォームとして機能します。参考ページ：実装するフォームの種類を選択
&formid	参考ページ：フォームの識別子
&rules	参考ページ：フィールドの検証（チェック）内容を設定
&formTpl	参考ページ：入力フォームのHTMLテンプレート
&errorTpl	参考ページ：フィールドの表示するエラーメッセージのHTMLテンプレート
&requiredClass	参考ページ：フィールドの必須エラー時のクラス名
&messagesOuterTpl	参考ページ：フォーム全体の表示するエラーメッセージのHTMLテンプレート
&successTpl	参考ページ：フォーム送信完了後に表示するHTMLテンプレート
&skipTpl	参考ページ：ログイン済みの場合に表示するHTMLテンプレート

ちなみにログアウトを行うには、ログインを実装している（FormLister）ページで、&logoutKeyパラメーターの値をURLにURLパラメーターで指定することでログアウトすることができます。
例：/foo/bar/baz/?logout

プレースホルダーについては次のページをご覧ください。
フォームやメールで使用するプレースホルダー

CMS「Evolution CMS」逆引きリファレンス一覧へ戻る