如何使用ui：插入Primefaces p：tabMenu

我有一個兄弟問題，我不知道如何解決。我有這個Primefaces p:tabMenu這是用來調用惰性加載標籤。如何使用ui：插入Primefaces p：tabMenu

<p:tabMenu id="tabs" activeIndex="0" > 
    <p:menuitem value="tab1" url="/tab1.jsf" /> 
    <p:menuitem value="tab2" url="/tab2.jsf" /> 

</p:tabMenu>

我想使用JSF標記ui:insert來調用標籤的代碼。如何將ui:insert標籤合併到上面的代碼中？

來源

2012-10-06 user1285928

你說的CAL標籤的代碼是什麼意思？ –

您應該瞭解如何使用[使用Facelets進行模板]（http://www.mkyong.com/jsf2/jsf-2-templating-with-facelets-example/）。您可以讓所有的tab.jsf文件擴展包含tabMenu的主模板。 –

你能告訴我如何使用'ui：insert'到'p：tabMenu'中嗎？ – user1285928

我看到2種方法在這裏：

1）每個使用一頁標籤。使用p：tabMenu組件（在primefaces 3.4中可用）。在這種情況下，如果用戶正在查看一個標籤並點擊第二個標籤來顯示它，他將被重定向到另一個頁面。
優點：如果你想從另一個頁面導航到第二個標籤，很容易，因爲它是一個不同的頁面（參見第二種方法）。此外，每個標籤頁的加載速度都很快，因爲它只包含一個標籤的代碼。你會有更好的代碼分離。
缺點：如果用戶轉到另一個選項卡，則當前選項卡中輸入的所有數據都將丟失。另外，從一個標籤更改爲另一個標籤並不是那麼快，因爲涉及導航。

這是頁爲一個突片（tab1.xhtml）：

<h:body> 
    <p:tabMenu activeIndex="0"> 
     <p:menuitem value="Tab 1" url="/tab1.jsf" /> 
     <p:menuitem value="Tab 2" url="/tab2.jsf" /> 
    </p:tabMenu> 
    <!-- content of tab1 goes here --> 
</h:body>

這對於其它標籤的代碼（tab2.xhtml）：

<h:body> 
    <p:tabMenu activeIndex="1"> 
     <p:menuitem value="Tab 1" url="/tab1.jsf" /> 
     <p:menuitem value="Tab 2" url="/tab2.jsf" /> 
    </p:tabMenu> 
    <!-- content of tab2 goes here --> 
</h:body>

2）另一種方法是使用p：tabView創建一個頁面。在這種情況下，所有的標籤內容都進入同一頁面。您可以在p：tabView上使用dynamic =「true」屬性按需渲染選項卡內容並加快頁面加載速度。
優點：從標籤頁到標籤頁的平滑過渡（始終保持在同一頁面上）。
缺點：如果您想直接導航到第二個選項卡，例如，它並不那麼容易。因此必須使用tabView的activeIndex屬性指向處理第一個選項卡的託管bean中的屬性，並且當您實際上不需要時，仍然會構建第一個選項卡的bean。

這是主要的頁面包含標籤代碼：

<h:body> 
    <p:tabView dynamic="true"> 
     <p:tab id="tab1" title="Tab 1" > 
      <ui:include src="tab2.xhtml" /> 
     </p:tabView> 
     <p:tab id="tab2" title="Tab 2" > 
      <ui:include src="tab2.xhtml" /> 
     </p:tab> 
    </p:tabView> 
</h:body>

，你需要爲每個標籤頁（插入到主網頁）： tab1.xhtml：

tab2.xhtml：

來源

2012-10-12 19:54:12 Damian

我想你想分享標籤之間的代碼？

我認爲你正盯着tabMenu組件。你不需要它幫助在這裏正確使用模板。

剛：

定義模板
有網頁使用該模板

這些網頁便可設爲標籤或任何你想要的。

適當的結構或許是定義tabs.xhtml

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui" 
    xmlns:pe="http://primefaces.org/ui/extensions" 
    xmlns:o="http://omnifaces.org/ui"> 


<h:head> 
    <h:outputStylesheet name="style.css" library="css" /> 
    <div id="header"> 

     <ui:insert name="header"> 
      <title><ui:insert name="title">title</ui:insert></title> 

     </ui:insert> 
    </div> 

</h:head> 

<h:body> 
    <div id="content"> 

     <ui:insert name="content"> 
     content here 
     </ui:insert> 
    </div> 

</h:body> 

</html>

然後爲每個有標籤：

<?xml version="1.0" encoding="UTF-8"?> 
<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:p="http://primefaces.org/ui" xmlns:o="http://omnifaces.org/ui" 
    xmlns:of="http://omnifaces.org/functions" 
    xmlns:pe="http://primefaces.org/ui/extensions" 
    template="/WEB-INF/templates/template.xhtml"> 

    <ui:define name="header"> 
    a specific tab header here 
    </ui:define> 
    <ui:define name="content"> 
    specific content here 
    </ui:define> 
    </ui:composition>

注意，這僅僅是標準模板與JSF 2.好運

來源

2012-10-10 19:52:16

是的。 JSF模板非常簡單。但是，我又如何將'p：tabMenu'與模板混合？ – user1285928

看看我上面的例子。 p：tabMenu中的每個選項卡都是用ui：composition編寫的頁面。這可能是一個模板頁面。如果您對此答案不滿意，大多數人都會舉一個恰當的例子說明您想做什麼。寫在僞代碼或其他東西 –

如何使用ui：插入Primefaces p：tabMenu

回答

相關問題