Form Post の結果を素敵に表示

function formPreview(form) {
	var query = $(form).toQueryString();
	var facSubmit = new Request();
	facSubmit.onSuccess = function(responseText, responseXML) {
		SqueezeBox.initialize({size:{x:600,y:400}});
		SqueezeBox.setContent('string', responseText);
	}
	facSubmit.send({data:query, url: form.action});
}

 CMS(Joomla!)で書いてる途中の記事をLightBox 的にプレビューしたくて、色々調べた結果、mooforumに行き着いて真似してみた。

 ところが、IE で「modal.js: 種類が一致しません」とか意味が分からないエラーが出る。

 仕方ないのでソースを解析して自分なりに解決してみた。現時点での最新 IE/FF (Windows) で動作を確認。

 主な流れとしては、

  1. Ajax でフォームの内容を送信
  2. success イベントで結果を取得
  3. 取得した結果を、string ハンドラで SqueezeBox に渡す

 散々、悩まされた割にはシンプルな出来になった。