CMSのポテンシャルを引き出す─MODxで作る商用サイト

第15回 MODxのスニペットを使いこなす─FormIT[その1]

この記事を読むのに必要な時間:およそ 4.5 分

FormITスニペットのパラメータ

無事スニペットが動作したところで,各パラメータの解説に移ります。オリジナルの解説は例のごとくMODx Documentationから得ることができますが,ここでは各項目を日本語で紹介します。

表2 FormITスニペットの基本オプション

パラメータ意味デフォルト値
hooksデータがポストされた際に,どの機能(hookと呼ばれる)を使用するか。 
preHooksフォームがロードされた際に,どの機能(hookと呼ばれる)を使用するか。 
submitVarsubmitボタンの名前をチェックし,不正な場合は処理を行わない。 
validate項目の妥当性をチェック。項目をカンマ区切りでリストする。 
validationErrorMessage妥当性チェックが失敗した場合に一般的にプレースホルダーにセットされるエラーメッセージ。<p class="error">A form validation error occurred. Please check the values you have entered.</p>
validationErrorBulkTpl一般的な妥当性チェックでエラーとなった場合のHTMLテンプレート。<li>[[+error]]</li>
errTplエラーメッセージ用のテンプレート(チャンクではなくHTML)<span class="error">[[+error]]</span>
customValidatorsカスタムな妥当性チェックを行う。項目をカンマ区切りでリストする。 
clearFieldsOnSuccess投稿が成功した場合でページをリダイレクトさせない場合にフォームの内容をクリアするかどうか。1
storeFormITRetrieverスニペットから使用するために,内容をキャッシュとして保存するかどうか。0
storeTime上記のキャッシュ保持時間。300
placeholderPrefixプレースホルダーのためのprefix(通常は変更する必要はない)fi.
successMessage投稿が成功した場合のメッセージ 
successMessagePlaceholder上記のプレースホルダー(通常は変更する必要はない)fi.successMessage

これらはあくまでもFormITスニペットの基本的なパラメータであるため,実際にはこれ以外にもさまざまなパラメータが用意されており,次回以降順次紹介していく予定です。

妥当性チェック(validate)について

基本パラメータの中でも最も重要とも言える,値の妥当性チェックについて解説します。

前述の問い合わせ用サンプルフォームからも想像できる通り,FormITスニペットを使用する場合には,リソース中にHTMLフォームを設置した上で,テキストエリアやチェックボックスなど,それぞれのフォームに対してvalidateパラメータを用いた妥当性チェックを行う必要があります。たとえば,

[[!FormIt?
-- 略 --
 &validate=`mailaddr:email:required,
-- 略 --
]]
-- 略 --
<input id="mailaddr" name="mailaddr" type="text" value="">

というリソースが設定されている場合には,mailaddrテキストボックスに対して

  • 値がメールアドレス形式であるかどうか
  • 何らかの値が入力されているか

というチェックが入り,それ以外の値はポストできません。この辺りで「では,具体的にどのようなチェックができるの?」といった疑問が湧いてくるかと思いますが,ビルトインされている妥当性チェックの一覧は

より得ることができます。

たとえば,年齢というフォームを加えたい場合,

[[!FormIt?
-- 略 --
 &validate=`age:isNumber:required,
-- 略 --
]]
-- 略 --
<input id="age" name="age" type="text" value="">

という形で数値チェックを行うことができ,組み合わせ次第では「入力は必須で,値は18~99である必要がある」といった設定もできるわけです。

ちなみに,先の例で紹介したメールアドレスの妥当性チェックに関してですが,⁠メールアドレス 正規表現」でgoogle検索すると分かるよう,記述方法については過去にいろいろな議論が行われています。実際にcore/components/formit/model/formit/fivalidator.class.phpを読む限りは,⁠厳密で本当に正しい」正規表現が用いられているわけではないため,それが困る場合にはご自身で修正を行うようにしてください。

カスタムな妥当性チェックについて

ビルトインされているチェック方法ではもの足りない場合には,独自のチェック方式を定義することもできます。たとえば,郵便番号が7桁であるかどうか簡単にチェックするためのルールを作成してみます。あくまでも7桁の数字を簡単にチェックするための正規表現なので,⁠表現が厳密じゃない!この著者はだめだ!」というツッコミは無しにしてくださいね(笑)⁠

リスト3 スニペット名: is_zipcode

<?php
if (!preg_match("/^\d{3}-\d{4}$/", $value)) {
  $validator->addError($key,'「3桁の数字-4桁の数字」という形式で入力してください');
}
return $success;
?>

FormITスニペットからの呼び出しは次のようにします。

リスト4 スニペットのコール例

[[!FormIt?
-- 略 --
 &customValidators=`is_zipcode`
 &validate=`name:required,
      email:email:required,
      zip:is_zipcode:required,
      message:required`
-- 略 --
]]

ブラウザの出力は次のとおりです。

図3 カスタムな妥当性チェックを行った場合のエラー出力

図3 カスタムな妥当性チェックを行った場合のエラー出力

以上,妥当性チェックの紹介でした。実際にエラー出力を行う場合には,HTMLタグやスタイルシートを活用して,文字を赤字にするなりエラーをポップアップさせるなり,デザイン上の応用が可能ですので,参考になるメールフォームのソースを元に,いろいろと試してみてください。

最後に

FormITスニペットは非常に実用的で高機能なスニペットですので,次回も引き続き各種機能やパラメータの解説を行っていきます。お楽しみに。

著者プロフィール

中満英生(なかみつひでお)

大学時代に出会ったSolarisがきっかけでUNIXの世界へ。その後ホスティングプロバイダ,データセンターで実務経験を積む傍ら,雑誌記事の執筆や技術セミナーの講師を務める。サーバ設定の他,セキュリティに関する著作や技術者エッセイも執筆経験あり。