和田憲幸のブログ

具体的にどういうことかと言うとコアの部分は不可侵にして、アドオンというカタチの機能拡張ファイルをセットすることで機能が発動するという仕組みです。これによりアドオン単体での配布・開発もできるし、多くの場合その機能はメールフォームプロのコアと干渉しないのでアップデートの時も安心という事ですね。アドオンはjsのみだけではなくjson、ajaxを利用する場合も想定しているため、例えばCGIなどと連携を取ることもできます。完全に和田得機能ですねこれ。

各アドオン用イベント

click・・・radio、checkboxがクリックされた時に発生。引数は対象エレメント。
change・・・値が変更されたときに発生。引数は対象エレメント。
focus・・・エレメントにフォーカスがあたった時に発生。引数は対象エレメント。
blur・・・エレメントからフォーカスが外れたときに発生。引数は対象エレメント。
init・・・各エレメントにイニシャライズ時に発生。引数は対象エレメント。
ready・・・メールフォームプロが利用可能になった時に発生。
startup・・・メールフォームプロのイニシャライズ前に発生。
calc・・・価格計算時に発生。
error・・・エラー（有効期限、募集数超過）時に発生。
warning・・・警告（有効期限警告、募集数制限警告）時に発生。

というようなイベントが用意されています。過去に何百何千とメールフォームを設置してきた和田的にこれだけのイベントが揃っていれば、だいたいなんでもできると踏んでいます。ようは直接エレメントにイベントをセットするのではなく、コアを通してアペンドするイメージですね。

で、今のところ実装したアドオンは以下の通り。

フリガナ機能（Firefox非対応）

フリガナ機能はinitイベント時にdata-kana属性がセットされたエレメントに対してonkeyupイベントをアペンドします。data-kana属性はフリガナの対象エレメント名（name）。

郵便番号からの住所呼び出し機能

過去FAQで動かないと質問を受ける事が多かったヤツです。initイベント時にdata-address属性がセットされたエレメントに対してonblur時に辞書を引くように設定します。onblurした時にajaxでアドオンを呼び出し引数をdata-addressで指定されたエレメントにセットします。特筆すべき点はこの機能を実行するために、特にCGIなどを調整する必要が無いということです。jsもアドオンも含めてすべてmfp.js.cgiというjs関連コアがすべての機能を賄ってくれるんです。スゴイ！

テキスト整形

テキスト整形機能は半角カタカナを全角カタカナに、全角英数を半角英数に変換します。これはblurイベント時にエレメントタイプがtextかtextareaの場合に実行されます。

ウェルカムメッセージ

これはデモ的な意味合いが強いアドオンですが、フォームが開かれた回数によって異なるメッセージをフォームエレメントのparentChildに出力します。例えば初回訪問時は「ようこそ！」とか10回目だったら「いい加減に送信してよ！」とかね。今回からPageViiewは参照しやすいカタチでセットされてるので他にも応用がきくかもしれませんね。

と、いう感じでアドオンがセットされます。アドオンは別々に呼び出す必要は無く、すべて統括するmfp.js.cgiというファイルで自動的にマージされます。というか今回の仕様ではmfp.js.cgiを呼び出すだけですべてが完結する仕様になりました。便利。マージされたデータはキャッシュされ、キャッシュが古くなった場合はリフレッシュされます。

設定ファイルの統合

設定ファイルはjsとcgiで分散せずに、すべてconfigs.cgiというファイル内に記述することになります。そういう経緯もあってmfp.js.cgiが必要だったというのもあるんですけどね。一箇所で全部変更できたほうが便利だしね。CGI側のアドオン（送信プロセスの時の）はその限りではないと思いますが。

と、いうことであまりカスタマイズされずに利用される事が多かったメールフォームプロですが、jqueryなんかをいじれる人はかなり遊びやすい仕組みになったと思います。価格計算時のイベントや仮想カートなんかの関数も用意したので「合計金額が1万円以上は10％OFF」なんて拡張もやりやすくなったしね。

まぁカスタマイズしない人がほとんどでしょうが、カスタマイズをしたい人はぜひご期待ください。