Welcome !! Now 2010.03.14 01:14 (JST)

Home » エレメント解説 » eForm

eFrom (1.4.4)

eformは、WEBフォームから入力されたデータをメールとして受け取るためのスニペットです。

自動返信機能や、フォームの入力データを複数のアドレス（管理者）宛に送信したり、フォームに入力されたアドレス（ユーザ）宛に内容のコピーを送ったり、その他、入力必須項目の設定、CAPTCHAを利用したフォームの作成など、大変豊富な機能を持っています。マルチ言語対応

参照ページ：eform／eForm 1.4.4 ISO-2022-JP対応版

※上記の eform ページでは1.4.3が配布されているようです。最新版は、MODx0.9.6に同梱されています。eForm 1.4.4 ISO-2022-JP対応版はこちらから。

テスト環境

サーバ：さくらインターネット　
- PHP 4.4.4
- MYSQL 4.0.27
MODX：0.9.5
eFrom (1.4.4)

このページの更新履歴

2008.08.03...カスタマイズ：エラーメッセージ表示をリスト表示にする

基本的な書式

[[eForm? &formid=`ContactForm` &tpl=`ContactForm` &report=`ContactFormReport`]]

必須パラメータ

formid

eformがページ内のフォームを識別するためのユニークID。これは、例えば、ページ内に複数のフォームがある場合に、有用でです。

ここで指定したformidは、「tpl」で指定するテンプレート内のフォームのhidden属性を持つフィールドか、フォーム自身のidに指定する必要があります。

フォームのhidden属性を持つフィールドとして指定: <input type="hidden" name="formid" value="formName" />
フォームidとして指定: <form method="post" action="[~[*id*]~]" id="formName" name="formName">

tpl

フォーム（表示／入力）用テンプレートをチャンク名（文字列）またはドキュメントIDで指定で指定します。また、スニペットをテンプレートソースとして利用できます。このバージョンではいかなるパラメータもスニペットコールへ転送されません。一般的なフォームフィールドなら、普通プレイスホルダを加える必要はありません。それらは、eFormによって、自動的に挿入されます。

しかし、特定のイベントファンクションを利用したい場合は例外です。特別のプレイスホルダとして以下が利用できます。

[+validationmessage+]
[+postdate+]
[+verimageurl+]
[+debugText+]

report

メール（出力）用テンプレートをチャンク名またはドキュメントIDで指定します。「tpl」と同じプレイスホルダに加え、[+fieldname+]が利用できます。これはフォームでのそれぞれのフィールドネームを挿入します。

オプションパラメータ

V 14.1 と比較して増えているパラメータには「added」をつけています

to

宛先（受取人）メールアドレスを指定します。「,」で区切って複数指定可能です。省略した場合「MODx設定」の「送信者メールアドレス」になります。

from

送信者（差出人）メールアドレスを指定します。省略した場合「送信者メールアドレス」になります。

fromname

送信者名を指定します。省略すると「サイト名」になります。

replyto

返信先メールアドレスを指定します。メールアドレスを直接指定するか、メールアドレスを含むフィールドネームを指定します。

sendirect

「1」を指定した場合、フォームのフィールド名に「email」を指定しているフィールドの値（メールアドレス）を宛先として送信します。この場合、サイト設定メールアドレスには送信されません。また、「to」で指定したアドレスは無視されます。

テンプレートサンプル：

<form id="formName" ……>
  <fieldset>
    <legend>送信内容</legend>
    <dl>
      ……
      <dt><label for="cfEmail">メールアドレス：</label></dt>
      <dd><input name="email" id="cfEmail" type="text" …… /></dd>
    </dl>
  </fieldset>
</form>

上記のようなHTMLの場合「<input name="email">」に入力されたメールアドレスが宛先になります。

cc

「to」と同様です。ただし、ccとして送信します。※現在機能せず※

bcc

「to」と同様です。ただし、bccとして送信します。

ccsender

「1」を指定した場合、フォームのフィールド名に「email」を指定しているフィールドの値（メールアドレス）にコピーを送信します。「sendirect」を参照してください。

subject

件名を指定します。直接テキストを入力するか、件名として出力したいフィールドネームを指定します。

テンプレートサンプル：

<form id="fromName" ……>
  <fieldset>
    <legend>送信内容</legend>
    <dl>
      ……
　　  <dt><label for="subject">件名</label></dt>
      <dd><input id="subject" name="subject" /></dd>
    </dl>
  </fieldset>
</form>

上記のようなHTMLの場合、「name="subject"」の値を「件名」として出力したければ、「&subject=`[+subject+]`」とします。

※フィールドネームに「subject」をもつフィールドがある場合、ここで指定したテキストより、フィールドネーム「subject」の値が優先されます。

noemail

「1」を指定した場合、宛先として指定したメールアドスレが無効になります。具体的には以下が無効になります。

サイト設定で指定した「送信者メールアドレス」
「to」で指定したメールアドレス
「sendirect」を指定した場合、フィールド名「email」に入力されたメールアドレス）

「ccsender」を指定した場合、その対象となるメールアドレスは無効になりません。

mailselector

セレクトメニューでセレクトされた値によって、送信先を振り分けます。「to」で指定したメールアドレスの並び順と、セレクトメニューでセレクトされた値が対応します。

スニペットコールサンプル：

[[eForm? …… &mailselector=`topic` &to=`メールアドレス１, メールアドレス２, メールアドレス３`]]

テンプレートサンプル：

<form id="fromName" ……>
  <fieldset>
    <legend>送信内容</legend>
    <dl>
      <dt><label for="cfRegarding">メッセージの分類：</label></dt>
      <dd>
        <select name="topic" id="cfRegarding" eform="セレクト::1">
          <option value="1">１番目の話題</option>
          <option value="2">２番目の話題</option>
          <option value="3">３番目の話題</option>
        </select>
　　　……
</form>

上記の例の場合、mailselectorは、フォーム上のフィールド名「topic」になり、フォームからの送信時、１番目の話題が選択されていれば、「to」で指定した１番目のメールアドレスに送信、２番目の話題が選択されていれば、「to」で指定した２番目のメールアドレスに送信…というようになります。

mobile

携帯用メールアドレス。後述の「mobiletext」で指定した内容を本文として送信します。

mobiletext

前述の「mobile」で指定した携帯用メールアドレスに送信する本文を指定します。以下のようにフィールド名を含める事もできます。

スニペットコールサンプル：: [[eForm? …… &mobile=`携帯メールアドレス` &mobiletext=`[+name+]からメッセージが届いています`]]

thankyou

「送信」後に表示するメッセージ（お礼やお知らせなど）をチャンク名、またはドキュメントIDで指定します。

gotoid

「送信」後に表示するドキュメント（サンキューページなど）をドキュメントIDで指定します

keywords

データバンクを検索するとき、コンマで区切られたキーワード、または、[+formfields+] を利用します。…ていうか意味が良くわからないのですが。。すみません。。

autosender

自動返信する際の送信者メールアドレスを指定します。

スニペットコールサンプル：: [[eForm? …… &autosender=`no-reply@xxx.com`]]

autoSenderNameadded

自動返信する際の送信者名を指定します。

automessage

自動返信用のテンプレートをチャンクまたはドキュメントIDで指定します。テンプレートでは、「tpl」で指定したテンプレート内で使用しているフィールド名を利用できます。宛先は、フィールド名「email」を持つフィールドの値（メールアドレス）になります。

テンプレートサンプル：

<p>お問い合わせ日：[+postdate+]</p>
<hr />
<p>お問い合わせありがとうございます。お問い合わせを受け付けました。
担当者からのご連絡を今しばらくお待ち下さい。</p>
<hr>
<p>お問い合わせ内容は以下です</p>
<ul>
  <li>おなまえ：[+name+]</li>
  <li>メールアドレス：[+email+]</li>
  <li>タイトル：[+subject+]</li>
  <li>メッセージの内容：[+message+]</li>
</ul>
<hr />
<p>尚、このメールには返信出来ません。</p>

allowhtml

入力フォームでの html タグの入力を許可するかどうかを指定します。デフォルト「しない（0）」。

language

マルチ言語をサポートしています。MODx設定の「言語」と同じ言語名で指定します。指定しない場合、MODx設定の言語を利用します。

スニペットコールサンプル：: [[eForm? …… &language=`Japanese-utf8`]]

問題点：同梱の言語ファイル名が「japanese-utf8.inc.php」と「j」が小文字のためパラメータで「&language=`Japanese-utf8`（MODx設定と同じ名前）」にすると無効になってしまう。指定する場合は、「&language=`japanese-utf8`」とすればOK。

vericode

CAPTCHによる入力チェックをするかどうかを指定します。デフォルトしない「0」。利用する場合、テンプレート側に、チェック用のフィールドが必要です。

テンプレートサンプル：

<p>[+validationmessage+]</p>

<form …… id="formName">
  <fieldset>
    <legend>送信内容</legend>
    ……
    <p>お手数ですが、見えている文字列を入力してください。</p>
    <dl>
      <dt>認証コード：<dt>
      <dd><img src="[+verimageurl+]" alt="認証コード" /></dd>
      <dt><label for="vericode">コードを入力：</label></dt>
      <dd><input type="text" id="vericode" name="vericode" size="20" /></dd>
    </dl>
  ……
</form>

debug

デバッグモードにするかどうかを指定します。デフォルト「しない（0）」。主に「#LIST」と「#SELECT」のデバッグに利用します。

sendAsHtml

html 形式で送信するかどうかを指定します。以下の値を指定できます。

1 … すべてのメッセージを html 形式で送信
report … repor 用メッセージのみ html 形式で送信
autotext … 自動返信用メッセージのみ html 形式で送信
mobile … モバイル用メッセージのみ html 形式で送信

「sendAsHtml=`report,autotext`」のようにコンマで区切って複数指定可能です。

sendAsText

1 … すべてのメッセージを text 形式で送信
report … repor 用メッセージのみ text 形式で送信
autotext … 自動返信用メッセージのみ text 形式で送信
mobile … モバイル用メッセージのみ text 形式で送信

「sendAsHtml=`report,autotext`」のようにカンマで区切って複数指定可能です。

sessionVars

session 変数をカンマで区切って指定します。利用方法はドキュメントを参照してください。

postOverides

sessionVars と一緒に使用します。利用方法はドキュメントを参照してください。

reportAbuse

利用方法はドキュメントを参照してください。

cssStyleadded

入力フォーム（または「&thankyou」が指定してあればサンキューページ（メッセージ））が表示されるとき、<head>～</head>にスタイルシートを挿入します。

ドキュメント ID、チャンク名、URL（絶対パス／相対パス）で指定します。カンマで区切って複数指定可能です。

スニペットコールサンプル：

[!eForm? …… &cssStyle=`assets/site/forms.css,チャンク名`!]

チャンクサンプル：

<style type="text/css">
  /*some styles*/
</style>

<link href="assets/site/forms.css" rel="stylesheet" type="text/css">

assets/site/forms.css,assets/site/more.css

jScriptadded

<head>～</head> にJavaScirptを挿入します。書式は「cssStyle」と同様です。現在、入力フォームが表示されるときのみ、JSを挿入します。

protectSubmitadded

同じ（フォームの）内容で、何度も送信されないようにするかどうかを指定しますデフォルト「する（1）」です。

フォームから最初に送信が成功した後、キーとなるフィールドの値が同じ状態のうちは、再び送信ができなくなります。

「0」を指定するとこの機能は off になります。「1」は、すべての必須フィールドがキーフィールドとして利用されます。また、カンマで区切ってフィールドネームを指定することもできます。

submitLimitadded

フォームからの送信に時間制限を設けるかどうかを分で指定します。デフォルトは「0（時間制限しない）」です。

一度送信が成功した後、「submitLimit」で指定した時間の間は、フォームの内容にかかわらず、再び送信することはできません。

「protectSubmint」と「submitLimit」を併用すると、「submitLimit」で指定した時間制限が過ぎたとき、「ProtectSubmit」の設定にかかわらず、フォームから送信が可能になります。

requiredClassadded

CSS クラス名を指定します。入力チェックでエラーになった必須項目のフィールドにクラス名が挿入されます。もし、既にクラス名が指定してある場合は、それは削除されずに残ります。「requiredClass」で指定したクラス名は、既存のクラスの後に挿入されるでしょう。デフォルト「required」。

invalidClassadded

CSS クラス名を指定します。入力チェックで無効な値と判断されたフィールドにクラス名が挿入されます。デフォルト「invalid」。既存のクラス名はそのまま残ります。「invalidClass」で指定したクラス名は、既存のクラスの後に挿入されるでしょう。デフォルト「invalid」。

runSnippetnew

詳しくはドキュメントを参照してください。

snipFoldernew

eForm のリソースファイルが存在するフォルダを指定します。

例として、バージョン1.4.4を「assets/snippets/eform/1.4.4」に保存したとき、「snipFolder=`eform/1.4.4`」と指定します（最後の / は必要ありません）。

PHP Event Functions

いちおう書いてみますが、プログラムがわからないので、様子がよくわかりません。ぜんぜん違うことを書いている可能性大。。添付のドキュメントを参照してください。またフォローお願できれば嬉しいです。

eFormOnBeforeMailSent

ファンクション名を指定します。このファンクションは、入力チェックの後、および「report」と「thankyou」テンプレートがパースされる前、およびすべての email が送信される前に呼ばれるでしょう。詳しい利用方法は、添付のサンプルドキュメントを参照してください

eFormOnMailSent

ファンクション名を指定します。このファンクションは、すべてのテンプレートがパースされた後、および、すべての email が送信された後に呼ばれるでしょう。

eformOnBeforeFormParse

ファンクション名を指定します。このファンクションは、テンプレートが読み込まれ、適切な「formid」が確認された後に呼ばれるでしょう。ファンクションは、次のパラメータを含むべきです。

&$templates: 「tpl」、「report」、「thankyou」、「autotext」で呼ばれたテンプレートの連想配列。後者の３つは、フォームがポストされた場合に値を持ちます

eFormOnBeforeFormMerge

ファンクション名を指定します。このファンクションは、フォームが表示されるときはいつでも、またすべてのプレイスホルダがマージされる前に呼ばれます。ファンクションは次のパラメータを含むべきです。

&$fields: フィールドの連想配列と、プレイスホルダの値

eFormOnValidate

ファンクション名を指定します。このファンクションは、フォームでの入力チェックが起こった後で直接呼ばれるでしょう。独自に作った入力チェックロジックを加えるためにこのイベントを利用できます。ファンクションは以下のパラメータを含むべきです。

&$fields: フィールドの連想配列と、プレイスホルダの値
&$vMsg: 入力チェック用エラーメッセージの数字配列
&$rMsg: ミスのある必須項目の数字配列

プレイスホルダ

標準的なフォームフィールド用のプレイスホルダは eForm によって自動的に挿入されますが、いくつかのフィールドは、自分で挿入する必要があるでしょう。

[+validationmessage+]

入力チェック用のエラーメッセージを挿入します。

プレイスフォルダまわりのタグは、言語ファイル（$_lang['ef_validation_message'] ）によって挿入されます。必要があればこれを変更します。

[+verimageurl+] & [+verimageurl+]

CAPTHCA codeを利用したい場合、このプレイスホルダをフォームテンプレートに置きます。

[+postdate+]

これは、「report」テンプレートと「thankyou」テンプレートで利用できます。送信日時を挿入します。

[+debug+]

「debug」がonの時、フォームテンプレートとサンキューテンプレートには、自動時にこのプレイスホルダが置かれますが、eamil 経由でサーバー情報が外に出ることを避けるため、初期状態ではリポートテンプレートには、このプレイスホルダは置かれません。必要ならばリポートテンプレートにこのプレイスホルダを追加します。

入力チェックのための eForm 属性

eForm 属性をセットしたフィールドは必須項目となります。

eFrom 属性の基本フォーマット

[description/title]:[datatype]:[required]:[validation message]:[validation rule]

データタイプ

string … 必須項目が空かどうかだけをチェックします
date … strtotime() function　に基づく正確な日付かどうかをチェックします
integer … 数字かどうかをチェックします (実際の整数かどうかはチェックしません？？)
float … 数字かどうかをチェックします
email … 妥当なメールアドレスかどうかをチェックします
file … アップロードされるファイルがサイズエラーを起こすかどうかチェックします（ファイルタイプはチェックしません）
html … 改行を<br />に変換する以外は string と同じです

ソースサンプル：: <input name="email" id="cfEmail" type="text" eform="メールアドレス:email:1" />

Extended Server Validation

※ここもとてもアヤシイです。添付のドキュメントを参照してください。またフォローお願できれば嬉しいです。※

サーバによる入力チェックとワードフィルタリングを使った非常に柔軟な入力チェックを eFrom 属性で、セットできます。入力チェックパラメータとして、カスタムエラーメッセージと入力チェック、またはフィルタルールをセットできます。

eForm 属性のサンプル：: eform="Year of Birth:integer:1:Must be between 1950 and 2002:#RANGE 1950-2002"

入力チェックのルール

#LIST

有効な値をカンマで区切って指定します。

サンプル：: #LIST blue,red,green.maroon

#RANGE

有効な数字、または数の範囲をカンマで区切って指定します。

サンプル：: #RANGE 1,3,-5~-15,60~82; 上記の例で、「60~82」は「82~60」としても同じ意味になります。

#SELECT

データベスクエリから取得された有効な値のリストを指定します。クエリは、単独のカラムを返すべきです（ファンクションは最初に返されたカラムについてのみチェックします）。

{DBASE}、{PREFIX} タグを利用できます（それらはMODxのデータベース名とテーブルプリフィックスに置き換えられるでしょう）。

サンプル：: #SELECT keyword FROM {PREFIX}site_keywords

#EVAL

これは将来的にサポートされなくなるため、非推奨とされています。「#FUNCTION」を利用してください

#FUNCTION

ファンクション名を指定します。ファンクションは単に一つのパラメータを予期し、「TRUE」または「FALSE」のどちらか一方を返すべきです。

ドキュメントにサンプルがあります。参照してください。

#REGEX

正規表現で指定します。構文は php のマニュアルを参照してください

#FILTER

「#FILTER」は、入力チェックをするのではなく、単にフィルタの基準を使って単語または値を置き換えます。以下のフィルタを利用できます

#FILTER #LIST: #FILTER #LIST badword,verybadword||goodword,verygoodword
#FILTER #EVAL: #FILTER #EVAL return myFilterFunction($value);
#FILTER #REGEX: 正規表現で置き換えます

セレクトボックス, ラジオオプション、チェックボックス

セレクトボックス、ラジオオプション、チェックボックスフィールドは、自動的に入力チェックされます。

隠し属性（Hidden フィールド）

サンプル１：

例えば、ドキュメントIDをストアしていて、そしてそのIDを変化させたくないとき、この初期値設定は便利です。

<input type="hidden" name="docId" value="31" />

サンプル２：

JavaScript によって計算された値がフォーム上のどこかのhidden フィールドでストアされていると仮定します。この時、hidden 属性が入力チェックを始めないように以下の属性を追加します。

<input type="hidden" name="calculatedField" value="" eform="::0::" />

サンプル３：

ある範囲にある整数を確実に得たいとき、以下のように属性をセットします。

eform="タイトル:データタイプ(integer):必須項目:エラーメッセージ:チェックルール(#RANGE)

セット例：: <input type="hidden" name="calculatedField" value="" eform="Calculated Value:integer:1:Calculation out of range:#RANGE 1-10" />

入力チェック用フォームフィールドサンプル

セレクトボックスを必須項目とする

<select name="mySelect" eform="Select Country::1" />
  <option value="en-au">Australia</option>
  <option value="en-us">USA</option>
</select>

テキストボックスを必須項目に、かつ日付のためのフォーマットをセットする

<input type="text" name="dobDate" eform="Date of Birth:date:1:@EVAL return (strtotime($value)!==-1)?true:false;" />

チェックボックスでひとつだけ必須項目をセットする

<input type="checkbox" name="myColors[]" value="Red" eform="Colors::1"/>
<input type="checkbox" name="myColors[]" value="Green" />

※上記３つのサンプルは添付のドキュメントから引用したものですが、ドキュメント中の「eform_option」は、「eform」の誤りです※

既出のバグ

よけいなブランクメールを送ってしまう

ccsenderを指定していないのに、フィールド名に「email」を持つアドレスにメールが送信される。しかし中身は「' '」というブランクメール。

次期バージョンで対応予定

参照：MODx:eForm フォーラム（英語）

尚、eForm 1.4.4 ISO-2022-JP対応版は、バグ対応済み（2007.5.14 現在）

サンプル

一般的な Web コンタクトフォーム

カスタマイズ

エラーメッセージ表示をリスト表示にする

この改造を行うと、eformが出力するエラーメッセージの部分をリスト（<ul><li>～</li></ul>）で出力します。

関連トピ：eform のエラーメッセージをリスト表示にしたい

改造するコード

eform.inc.php L289 付近：

$tmp .= implode("<br />",$vMsg);

↓

$tmp .= (count($vMsg)>0)? "<li>".implode("</li><li>",$vMsg)."</li>" :"";

動作サンプルは、こちらの「eFormによるコンタクトフォームサンプル」で確認できます。

プレビュー機能をつけよう

eFormにプレビュー機能を実装できます。

参照：まいにち@ぐたぐだ／eformにプレビュー機能を付けてみた（その後）

動作サンプルは、「eFormによる申し込みフォームサンプル」で確認できます。

掲示板はこちら

エレメント解説

お勧めアイテム

△ページトップ

Let's enjoy MODx

eFrom (1.4.4)

テスト環境

このページの更新履歴

基本的な書式

必須パラメータ

formid

tpl

report

オプションパラメータ

to

from

fromname

replyto

sendirect

cc

bcc

ccsender

subject

noemail

mailselector

mobile

mobiletext

thankyou

gotoid

category

keywords

autosender

autoSenderNameadded

automessage

allowhtml

language

vericode

debug

sendAsHtml

sendAsText

sessionVars

postOverides

reportAbuse

cssStyleadded

jScriptadded

protectSubmitadded

submitLimitadded

requiredClassadded

invalidClassadded

runSnippetnew

snipFoldernew

PHP Event Functions

eFormOnBeforeMailSent

eFormOnMailSent

eformOnBeforeFormParse

eFormOnBeforeFormMerge

eFormOnValidate

プレイスホルダ

[+validationmessage+]

[+verimageurl+] & [+verimageurl+]

[+postdate+]

[+debug+]

入力チェックのための eForm 属性

eFrom 属性の基本フォーマット

データタイプ

Extended Server Validation

入力チェックのルール

#LIST

#RANGE

#SELECT

#EVAL

#FUNCTION

#REGEX

#FILTER

セレクトボックス, ラジオオプション、チェックボックス

隠し属性（Hidden フィールド）

サンプル１：

サンプル２：

サンプル３：

入力チェック用フォームフィールドサンプル

セレクトボックスを必須項目とする

テキストボックスを必須項目に、かつ日付のためのフォーマットをセットする

チェックボックスでひとつだけ必須項目をセットする

既出のバグ