利用方法

Ajaxを利用しているかどうかはnoscriptというキーの値によって判別しています。
これがfalseの場合のみAjaxを使っていると判断して結果がすべてprint出力になりますので、フォームか送信データ内に含めるようにしてください。

hiddenフィールドの場合：

<input type="hidden" name="noscript" value="false" />

MooToolsのForm.Request（或いはその他ライブラリ）の場合：

extraData :{"noscript":"false"}

noscript=trueもしくはPOSTされるデータの中にnoscriptというキーが含まれていない場合は、通常動作と同じくページ遷移を行います。

ファイル添付を利用する場合は通常の方法で送信を行ってください。

確認画面の表示 ver1.4

POSTされるデータの中にconfim=trueがあるとPHP版のような確認画面が返されます。
確認画面のボタンを押した際に再び同じフォーム内容を送信することになるので、送信するデータにmode=Sendという値を追加してください。

zeromail-ajax.js

追加パッケージで配布しているjsファイルについて解説。

MooToolsのForm.ValidatorとForm.Requestを併用するものになっています。
バリデーターは定番のエラーメッセージがフォームの下に表示されるForm.Validator.Inlineで、
Form.Requestはスピナーとかが表示されるForm.Request.Appendを使用するソースです。
同封のmootools-formpack.jsにはForm.ValidatorとForm.Requestに関するMore全てと、
この記事で晒している日本語正規表現チェック、
Noritaka Horio氏作langファイル（の警告メッセージをZeroMailと揃えたもの）が含まれています。

フォームバリデーションについて

Ajaxパックに入れてあるmootools-formpack.jsにはMooToolsのForm.Validaterが含まれています。
zeromail-ajax.jsで呼び出しているのはForm.Validater.Inlineクラスです。

バリデートの指定は基本的に全てクラス名です。
公式ドキュメントにあるものと、Form.Validator.Extrasのクラス、この記事で晒しているクラスが有効。
使い方はNoritaka Horio氏によるForm.Validaterの解説記事がとても参考になります。

郵便番号での住所検索について ver1.4.5

バリデーションと分離してMooToolsプラグイン化しました。
mootools-formpack.jsを読み込むと使用できます。

郵便番号の入力フィールドにクラスで validate-zipcode-btn　または validate-zipcode-autocomp　を付与してから、
郵便番号の入力フィールドが持つIDと同じクラス名を住所の入力フィールドに付与します。

<tr>
	<th scope="row"><label for="zipcode">郵便番号</label></th>
	<td><input name="zipcode" type="text" id="zipcode" size="8" class="validate-zipcode-btn" /></td>
</tr>
	<tr>
	<th scope="row"><label for="address">住所</label></th>
	<td><input name="address" type="text" id="address" size="50" class="zipcode" /></td>
</tr>

検索で得られた住所は郵便番号フィールドのIDと同じクラスを持つ住所フィールドに表示されます。

validate-zipcode-btn　→　有効な郵便番号が入力された後に住所検索ボタンを表示
validate-zipcode-autocomp　→　有効な郵便番号が入力されると自動で住所検索

レスポンスに広告やスクリプトが挿入される場合

Ajaxで送受信を行う場合、広告が挿入される無料レンタルサーバーだと
大抵zeromail.phpからのレスポンスにも広告が挿入されてしまうので、
JavaScript側でそれらを削除する設定が必要になってきます。
ライブラリを使用するとレスポンスに含められるスクリプトは自動的に削除してくれたりしますが、
アクセス解析などのJavaScriptが残ったまま表示すると最悪フリーズしてしまうので注意が必要です。

以前デモを置いていた@PAGESの広告はdivタグ＋style属性にtext-align:centerだったので、それを利用して削除していました。

onSuccess:function(el,html){
	req.disable();//フォーム一時停止
	var inner = el.getChildren();//中身取得
	$each(inner,function(div){//広告を探す
		if(div.getProperty("style")=="text-align: center;")
			div.destroy();//要素削除
	});
	if(!el.get("text").test("エラー")) $(form).reset();//内容のリセット
	
	//ボタン作成
	new Element("button",{"id":"close","html":buttonText,
		"events":{
			"click":function(){el.dissolve();req.enable(); }
		}
	}).inject(new Element("p",{"class":"button"})).inject(el,"bottom");
}