通過選擇菜單上的選項動態選項卡

我對JSF和Web編程有點新，我使用的是primefaces 6.0，並嘗試打開TabView的TOP MENU。每次您在TOP MENU中選擇一個選項時，都會在TabView上打開一個新選項卡，其中包含所選選項的內容。通過選擇菜單上的選項動態選項卡

我正在尋找，但沒有找到如何做到這一點。

謝謝你們！

來源

2017-04-10 Gustavo Chinaglia

對於初學者，我建議您使用<p:layout>組件分割您的頁面，並在標籤中顯示內容我建議您使用<ui:include>你可以閱讀關於它here。
所以，你的主頁應該是這個樣子：

<!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:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:p="http://primefaces.org/ui"> 
<h:head> 
</h:head> 

<body> 
    <p:layout> 
     <p:layoutUnit position="north"> 
      <!-- !!!!!!!!!! Menu goes here !!!!!!!!!!! --> 
     </p:layoutUnit> 
     <p:layoutUnit position="center" resizable="false"> 
      <p:tabView> 
       <p:tab title="Title goes here"> 
        <ui:include src="content" /> 
       </p:tab> 
      </p:tabView> 
     </p:layoutUnit> 
    </p:layout> 
</body> 

</html>

注：如果要動態生成你的標籤，你會想創建一個自定義標籤類，並在標籤使用JSTL的<c:forEach>循環填充tabView。

XHTML：

<p:tabView> 
    <c:forEach items="#{homeView.openTabs}" var="tab"> 
     <p:tab title="#{tab.title}" closable="true" rendered="#{tab.open}"> 
      <ui:include src="#{tab.content}"/> 
     </p:tab> 
    </c:forEach> 
</p:tabView>

注意openTabs是選項卡的ArrayList。

自定義選項卡類：

public class Tab { 

    private String title; 
    private String content; 
    private boolean open; 

//Custom constructor, getters and setters...

提示：
使用<p:tab>渲染屬性來處理關閉和重新打開的選項卡。請務必使用tabView的自定義事件<p:ajax event="tabClose" listener="#{homeView.onTabClose}"/>進行高級事件處理。

來源

2017-04-26 09:03:02 RedaN

通過選擇菜單上的選項動態選項卡

回答

相關問題