Primefaces tabview 设置默认静态选项卡

Posted 2023-05-08

【中文标题】Primefaces tabview 设置默认静态选项卡

【英文标题】：Primefaces tabview set default static tab

【发布时间】：2019-11-17 15:56:29

【问题描述】：

我在 primefaces TabView 组件中实现了动态选项卡。 现在选项卡已成功打开和关闭，没有任何问题。 现在，我想在动态 primefaces tabview 上添加默认静态选项卡。 （第一个索引） 这是我的示例代码：

      <p:tabView id="tab-group"
                   style="width: 100%"
                   value="#webSocketBean.listTargetServers"
                   var="tab">
            <p:ajax event="tabClose" listener="#webSocketBean.closeChannel" skipChildren="false"/>

            <p:tab id="welcome-tab"
                   title="Getting Started"
                   titleStyle="background-color: #1b6bad ; color: white">
                <ui:include src="getting-started.xhtml"/>
            </p:tab>

            <p:tab title="#tab.ipAddress"
                   titletip="#tab.ipAddress (#tab.name #tab.logPath)"
                   closable="true">
                <p:inputText placeholder="Search" styleClass="log-search-box"/>
                <div class="log-box">
                    <h:outputText id="logOuputText_#tab.id" value=""/>
                </div>
            </p:tab>
        </p:tabView>       

这是我的 Java bean：

@Named
@SessionScoped
public class WebSocketBean implements Serializable 

    private List<TargetServer> listTargetServers;
    private TargetServer selectedTargetServer;

    @PostConstruct
    public void init() 
        listTargetServers = new ArrayList<>();
    

    public void openChannel() 
        listTargetServers.add(selectedTargetServer);
    

    public void closeChannel(TabCloseEvent event) 
        selectedTargetServer = (TargetServer) event.getData();
        listTargetServers.remove(selectedTargetServer);
    

    public List<TargetServer> getListTargetServers() 
        return listTargetServers;
    

    public void setListTargetServers(List<TargetServer> listTargetServers) 
        this.listTargetServers = listTargetServers;
    

    public TargetServer getSelectedTargetServer() 
        return selectedTargetServer;
    

    public void setSelectedTargetServer(TargetServer selectedTargetServer) 
        this.selectedTargetServer = selectedTargetServer;
    

Welcome-Tab 未显示在我的示例代码中。 如何解决这个问题？

我的环境： OpenLiberty 19.0.0.4 Primefaces 7.0 JSF 2.3

【问题讨论】：

您是否已经尝试过c:forEach 变体？ ***.com/a/44725750/865107

我的 forEach 还有一些问题，我不能用那个。

【参考方案1】：

终于。 我用 JSF 上的一个简单技巧解决了我的问题。 实际上这不是一个好的解决方案，但解决了我的问题。 我把 bean 改成了这个：

@Named
@SessionScoped
public class WebSocketBean implements Serializable 

    private List<Object> listTargetServers;
    private TargetServer selectedTargetServer;

    @PostConstruct
    public void init() 
        listTargetServers = new ArrayList<>();
        Tab tab = new Tab();
        tab.setText("Getting Started");
        listTargetServers.add(tab);
    

    public void openChannel() 
        listTargetServers.add(selectedTargetServer);
    

    public void closeChannel(TabCloseEvent event) 
        selectedTargetServer = (TargetServer) event.getData();
        listTargetServers.remove(selectedTargetServer);
    

    public List<Object> getListTargetServers() 
        return listTargetServers;
    

    public void setListTargetServers(List<Object> listTargetServers) 
        this.listTargetServers = listTargetServers;
    

    public TargetServer getSelectedTargetServer() 
        return selectedTargetServer;
    

    public void setSelectedTargetServer(TargetServer selectedTargetServer) 
        this.selectedTargetServer = selectedTargetServer;
    
   

并将 xhtml 更改为：

       <p:tabView id="tab-group"
                   style="width: 100%"
                   value="#webSocketBean.listTargetServers"
                   var="tab">
            <p:ajax event="tabClose" listener="#webSocketBean.closeChannel" skipChildren="false"/>

            <c:set var="tabType" value="#tab['class'].simpleName"/>
            <p:tab title="#tabType eq 'TargetServer' ? tab.ipAddress : tab.text"
                   titletip="#tabType eq 'TargetServer' ?  tab.ipAddress.concat(' (').concat(tab.name).concat(')'): null"
                   titleStyle="#tabType eq 'TargetServer' ? '' : 'background-color: #1b6bad ; color: white'"
                   closable="#tabType eq 'TargetServer' ? 'true' : 'false'">
                <h:panelGroup layout="block" styleClass="log-box" rendered="#tabType eq 'TargetServer'">
                    <p:inputText placeholder="Search" styleClass="log-search-box"/>
                    <div class="logOutputText">
                        <h:outputText value=""/>
                    </div>
                </h:panelGroup>
                <h:panelGroup layout="block" styleClass="log-box" rendered="#tabType eq 'Tab'">
                    <ui:include src="getting-started.xhtml"/>
                </h:panelGroup>
            </p:tab>

        </p:tabView>    

有点硬编码，但这是解决我的问题的简单想法。