jsf - 如何在单击 tabview 的选项卡时转发到新页面

Question

我有一个名为Tabview1的页面，它由 tabview 组成。

   Tabview1.xhtml:
       <p:tabView>
            <p:tab title="1">
               <ui:include src="/Apanel.xhtml"/>
            </p:tab>
            <p:tab title="2">
            </p:tab>
            <p:tab title="3">
            </p:tab>
        </p:tabView>

如果单击名为2的选项卡，我想转发到 Tabview2.xhtml 页面。

Tabview2.xhtml:
       <p:tabView>
            <p:tab title="1">
            </p:tab>
            <p:tab title="2">
               <ui:include src="/Bpanel.xhtml"/>
            </p:tab>
            <p:tab title="3">
            </p:tab>
        </p:tabView>

谁能帮我 ？

Answer 1

Tabview creates a list with one element for each tab. Every <li> contains an <a href="#j_idtXXX">. Create a script on your site that changes these links to Tabview2.xhtml. For example if you set the id of your tabview to "tabview":

jQuery("#tabview ul a").first().attr("href", /MyPortal/Tabview2.jsf?tab=0);

This would cause the first tab to lead to the new page, and select the right tab on that page if you have configured a viewparam and have activeIndex="#{controllerClass.activeIndex}" set on the tabview.

I'm in a rush now, so I only had time to write a short example, but if you have some skill with javascript, it should not be too hard.

Answer 2

               <p:tabView>
            <p:tab title="Title1">
               <p:panel>  
                <ui:include src="tabView1.xhtml" />
               </p:panel>
            </p:tab>
            <p:tab title="Title 2">
                 <p:panel>  
                <ui:include src="tabView2.xhtml" />
                 </p:panel>
             </p:tab>           
        </p:tabView>