Ethnaで作るjQuery入力フォームのコツ

yugokitajima @yugokitajima

HTMLテンプレートエンジンを使って動的なjavascriptの構文を記述する、というノウハウがいつしか溜まっていた。jQueryのライブラリは簡単かつ機能的で重宝する。

yugokitajima @yugokitajima

PHP -> Ethna -> Smarty -> jQuery 。この流れの最後の２つをいかになだらかに繋げるかがプログラマのこだわり。

yugokitajima @yugokitajima

例えばこんなウェブページ。「どの店に行きますか？->八百屋」「何を買いますか？->茄子2個とキャベツ1個とミカン1山」。アクセス時間によって空いてる店が違うし、季節によって品揃えも変わる。

yugokitajima @yugokitajima

方法は大きく2つ。1：Smartyでjavascriptにjsonの集積データを渡してjavascriptで分岐処理する。2：Smartyの繰り返し文でシンプルなjavascript構文を列挙する。今回連投してまで語りたいのは2の方法。

yugokitajima @yugokitajima

php側でまずHTML中のフォーム個々のidを発行する。フォームの名前はidと同じにするルール。Ethnaのフォーム定義を生成する。idのリストをSmartyに出力。Smartyの繰り返し文で各idのjavascript記述とEthnaのフォームヘルパーの記述をする。以上。