[Zend_View] Tabs contain object (embedding documents)

Question

Hi,

My project is based on MVC architecture and I have a UI design pattern problem. I have several tabs which contain object as show in the picture.

My first idea was to link a tab to one view (phtml) so in the document each tabs is an embedding document. The tab contains an element with an url to a page. I show you a piece of code. The tabs are base on jquery UI tabs.

    <table>
    <tr>
        <!-- Panneau droit en haut -->
        <td>
            <div class="resizable">+<span>Graphiques</span></div>
            <div class="onglet">
            <!-- En-tête des tabs -->
            <ul>
                <li><a href="#right-top-pane-tab-1">Classe inherited</a></li>
                <li><a href="#right-top-pane-tab-2">Classe collaboration</a></li>
            </ul>
            <!-- Contenu des tabs -->
            <div id="right-top-pane-tab-1"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "inherited", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            <div id="right-top-pane-tab-2"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "collaboration", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            </div>
        </td>
    </tr>
    <tr>
        <!-- Panneau droit en bas -->
        <td>
            <div class="resizable">+<span>Informations</span></div>
            <div class="onglet">
            <!-- En-tête des tabs -->
            <ul>
                <li><a href="#right-bottom-pane-tab-1">Description</a></li>
                <li><a href="#right-bottom-pane-tab-2">Code Source</a></li>
                <li><a href="#right-bottom-pane-tab-3">Toutes les fonctions</a></li>
                <li><a href="#right-bottom-pane-tab-4">Public</a></li>
                <li><a href="#right-bottom-pane-tab-5">Protected</a></li>
            </ul>
            <!-- Contenu des tabs -->
            <div id="right-bottom-pane-tab-1"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "description", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            <div id="right-bottom-pane-tab-2"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "source", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            <div id="right-bottom-pane-tab-3"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "all", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            <div id="right-bottom-pane-tab-4"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "public", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            <div id="right-bottom-pane-tab-5"><object data="<?= $this->url(array("module" => "explorer", "controller" => "class", "action" => "protected", "id" => $this->id, "refid" => $this->refid)); ?>"></object></div>
            </div>
        </td>
    </tr>
    </table>

In my opinion it is easier to maintain but now the problem is that when navigation is possible (ie: the tab "Class" in the example) inside the object the content is only updated in the embedding document and not in the parent document as I would.

So my question is how do I do to use my architecture (a view per tab) and a navigation in the parent document. (ie: like in the google news tabs opens in an other document and are not embedding).

Solution: I have found several ways to solve my problem and it seems my problem is more Zend_View related. Some trails:

Composite View

ActionStack

...and all about Partial from Zend_View

Toddoon.