symfony1.4 jQueryの便利なプラグイン

Blogの更新をサボってしまいました。。申し訳ありません・・・

最近jQueryを触ることが多かったので、その話題をひとつ。

jQueryをそのまま使うだけでも便利ですが、このプラグインを使うともっと便利になります
ということで、「sfJqueryReloadedPlugin」の使い方をご紹介します。

インストールは、お決まりのsymfonyコマンドで。

symfony plugin:install sfJqueryReloadedPlugin

インストールすると分かりますが、中身はlib/helper/jQueryHelper.php というヘルパーと
web以下にjQuery一式が入っているだけです。

このヘルパーを利用すると、Ajaxによる通信とHTMLの要素書き換えが非常に楽になります。

例えば、「リロード」リンクを押すと一覧が画面遷移せずにリフレッシュされる処理だと
通常は

<script type="text/javascript">
  function reload() {
    $.ajax({
       type: ‘POST’,
       dataType:’html’,
       url: <?php echo url_for(‘@reload’) ?>
       success: function(data) { $("#list").html(data); },
       beforeSend: function() { $(‘#indicator’).show(); },  // ローディング中表示
       complete:function() { $(‘#indicator’).hide(); }      // ローディング中非表示
    });
  }
</script>
<a href="#" onclick="reload(); return false;">リロード</a>;
<div id="list">
  一覧表示
</div>
という風に実装していきます。

これを上記ヘルパーを使うと、
<?php echo jq_link_to_remote(‘リロード’, array(
   ‘url’ => ‘@reload’,
   ‘update’ => ‘#list’,
   ‘loading’ => ‘$("#indicator").show();’,
   ‘complete’ => ‘$("#indicator").hide();’,
  )); ?>
<div id="list">
  一覧表示
</div>

となり、javascriptの記述がほとんど無く、すっきりしたコードになります。

上記以外も、

jq_button_to_remote(); ・・・ 上記サンプルのボタン版
jq_form_remote_tag(); ・・・ formのサブミット時にajaxによる通信で処理を行う。
jq_submit_image_to_remote();  ・・・  画像によるサブミット版。

等々、様々な関数が用意されているので、symfony + jQueryを使っている方にお勧めです。

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL