0
votes

I implemented dynamic tab in primefaces TabView component .
now tab successfully opened and closed without any problem .
now , I want to add default static tab on dynamic primefaces tabview . (First index)
this is my example code :

      <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>       

this is my 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 not showed in my example code .
How can fix this ?

My environment :
OpenLiberty 19.0.0.4
Primefaces 7.0
JSF 2.3

1
Did you already try the c:forEach variant? stackoverflow.com/a/44725750/865107Selaron
I have some another problems with forEach , I can not used that .mah454

1 Answers

0
votes

Finally .
I fixed my problem with a simple trick on JSF .
actually this is not a good solution , but fixed my problem .
I changed bean to this :

@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;
    }
}   

And Changed xhtml to this :

       <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>    

little bit hard coding , but that is a simple idea for fix my problem .