2008年5月19日(月曜日)

symfony+sfModalBoxPluginで簡単ダイアログ

カテゴリー: - sato @ 12時32分52秒

satoです。
今回はsymfonyフレームワークで、簡単にダイアログボックス的なものを表示してみます。
sfModalBoxPluginを利用します。

・sfModalBoxPluginのインストール
sfPrototypePluginが必要なので、先にインストールします。

$ symfony plugin-install http:⁄⁄plugins.symfony-project.com/sfPrototypePlugin
$ symfony plugin-install http:⁄⁄plugins.symfony-project.com/sfModalBoxPlugin

細かい設定は特に必要ありません。

・ダイアログ側作成
まず、ダイアログとして表示したいactionを作成します。
apps/frontend/modules/dialogtest/actions/actions.class.php

  public function executeDialog()
  {
  }

apps/frontend/modules/dialogtest/templates/dialogSuccess.php

<p>hello dialog box</p>
<p><a href="#" onclick="Modalbox.hide();return false;">close</a></p>

・呼び出し元作成
apps/frontend/modules/dialogtest/actions/actions.class.php

  public function executeTest()
  {
  }

apps/frontend/modules/dialogtest/templates/testSuccess.php

<?php use_helper('ModalBox') ?>
<?php echo m_link_to('show dialog', 'dialogtest/dialog') ?>

・実行
dialogtest/testをブラウザで表示すると、

このような画面になります。ここで「show dialog」をクリックすると

このような画面になります。「close」をクリックすると元の画面に戻ります。

例えばselectタグでは多すぎるような項目を選択させる際に、ダイアログを出して選択させて、選択結果をJavaScriptで元の画面に挿入するようにすると、操作性が上がると思います。
デザインの都合上、管理画面などに利用するのが向いていると思います。
actionがそのままダイアログとして利用できるのは便利だと思うので、是非試してみてください。

ModalBoxの詳しい説明は、ModalBox | Wildbitをご覧下さい。sfModalBoxPluginについてはsfModalBoxPlugin - symfony - Tracをご覧下さい。


RSS feed for comments on this post.

ƤˤϡޤȤդƤޤ

Ȥ

ʤߥȤդ뤳ȤϽޤ

10 queries. 0.010 sec.
Powered by WordPress Module based on WordPress ME & WordPress

〒104-0061 東京都中央区銀座1丁目3番3号 G1ビル7階
お問い合わせ TEL 03-3524-8860

Copyright(c) 2012 RYUS.All Rights Reserved.