zendフレームワークjquery UIタブ付きコンテンツ、パーシャルからのクリックでコンテンツをロードする方法は?

jquery zend-framework
zendフレームワークjquery UIタブ付きコンテンツ、パーシャルからのクリックでコンテンツをロードする方法は?

jQuery UIのタブ付きコンテンツとデータテーブルを使用して、データベースの情報をレンダリングしています。 これはすべて1つのページにあり、各テーブルはページ上に隠されているだけなので、データベースへの不要なクエリがたくさんあります。

このサイトはzendフレームワークを使用しており、このページには1つのコントローラーとビューファイルが読み込まれます。 パーシャルの使用を考えていましたが、タブをクリックした後にのみパーシャルをロードできますか? もしそうならどうですか? または、タブ付きコンテンツのこのページを最適化するより良い方法はありますか?

ありがとう

  1  1


ベストアンサー

ユーザーがタブをクリックした後にタブのコンテンツをロードすることができます-実際、http://jqueryui.com/demos/tabs/#ajax [jqueryui.com demos section]に簡単な例があります。

サーバー側では、タブビューを個別のアクションに分割し(明確にするために、ここではパーシャルだけでなく、各タブの個別のアクションとビューテンプレートについて考えています)、レイアウトをオフにしてテンプレートのみをレンダリングします:

class FooController extends Zend_Controller_Action
{
    public function barAction()
    {
        if($this->getRequest->isXmlHttpRequest()) {
            $this->_helper->layout->disableLayout();
        }

        // normal logic goes here
    }
}

そして、ビューでは、タブのコードは次のようになります。

$(function() {
    $( "#tabs" ).tabs({
        ajaxOptions: {
            error: function( xhr, status, index, anchor ) {
                $( anchor.hash ).html(
                    "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                    "If this wouldn't be a demo." );
            }
        }
    });
});




    Preloaded
     "foo", "action" => "bar"), "default", "true") ?>">Tab loaded by ajax


    Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.

3


タイトルとURLをコピーしました