フォーム内で画像を選ばせるようなインターフェースが出来ないものかと考えていて、今はやりのlightbox的なモーダルダイアログを実現出来ないかと思い、とりあえず自作してはみたのですがイマイチだったので、なんかこういうツールがないかなと思っていたのですが…
やっぱりちゃんとあるんですね!
▼ThickBox 3.1
http://jquery.com/demo/thickbox/
使い方はとっても簡単!
基本的に、ダウンロードしたJavaScriptファイルやcss、それとjQueryをwebroot内に設置して、表示したいもののURLを指定するだけ!iframe形式も、Ajaxによる埋め込みも可能です!
簡単な秘密は、URLにquery string(?~)でパラメータを渡すため、設定が不要だからだと思います。
この方式は欠点もありますが… このクエリストリングが実サイトの方にも行ってしまうため、たとえばgoogleなんかを呼び出すことは出来ないです。
本体の設置は省略して、viewにはこんな風に書けばOK!
<?php echo $html->css('thickbox'); ?> <?php echo $javascript->link('jquery'); ?> <?php echo $javascript->link('thickbox'); ?> <?php //echo $html->link('テスト', array( 'controller' => 'hoge', 'action' => 'fuga', '?' => array( 'keepThis' => true, //iframeを使用する場合。Ajaxの場合はこれらを書かない 'TB_iframe' => true, // 'height' => '70%', 'width' => '70%', ), 1, 2, 3, ), array( 'class' => 'thickbox', 'title' => 'てすとですよ', )); ?>
まあ実際に設置してもらうと分かりますが、例えばこんな感じに表示できます。

あと気をつけなければならない点として、Ajaxとして使う場合、paginate等で遷移させることが困難になるため、こちらもAjaxで実現しなければなりません。CakePHP1.2は基本的にprototype.jsであり、そのままではjQueryと共存が出来ないため、多少工夫がいるようです(詳しくはググってください)。こういった場合はiframeでやるのが手っ取り早いかもですね。この場合は、値の受け渡し等でiframeをまたぐ必要があり、これもまた工夫が必要ですが…
というわけで、とりあえずlightboxチックなユーザインターフェースをご希望でしたら是非thickboxを!
紹介していただいたkaz_29さん、ありがとうございました。大変に助かりました!