将动态选项卡添加到rich:tabPanel

时间:2013-01-23 23:26:03

标签: jsf-2 richfaces

我正在开发我的第一个jsf2 richfaces应用程序,现在我遇到了以下问题:

我有以下menù

<rich:panelMenu >
            <rich:panelMenuGroup >
                 <rich:panelMenuItem label="Users" name="Users " />
                 <rich:panelMenuItem label="Orders" name="Orders"  />
            </rich:panelMenuGroup>

</rich:panelMenu>

我希望当单击panelMenuItem时创建一个新选项卡,并且在这个新选项卡中必须插入一个包含我的应用程序的所有用户的表

我看到了这种类型的一些例子

 <rich:tabPanel switchType="client" id="tabPanel">
    <c:forEach items="#{handlerTab.tabsName}" var="tabName">
        <rich:tab name = ... >

    </rich:tab>
</c:foreach>

但不知道在我的新标签中插入表格

我该怎么办?


坦克为你的回复,但我不想声明视图中的所有标签,我想动态添加和删除标签,现在我已设法做到这一点

 <rich:panelMenu >
 <rich:panelMenuGroup >
     <rich:panelMenuItem label="Users" name="Users"  action="#{tabsBean.createTabs()}" render="tabs" />
     <rich:panelMenuItem label="Orders" name="Orders"  action="#{tabsBean.createTabs()}" render="tabs" />
 </rich:panelMenuGroup>                

<h:panelGrid id="tabs" binding="#{tabsBean.panelGrid}"/>

然后我有一个管理选项卡的bean

@ManagedBean
@SessionScoped
public class TabsBean {

   private HtmlPanelGrid panelGrid;
   private Integer numOfTabs;

   @PostConstruct
   public void init(){numOfTabs=1;}


   public Integer getNumOfTabs() {
    return numOfTabs;
   }

   public void setNumOfTabs(Integer numOfTabs) {
    this.numOfTabs = numOfTabs;
   }

   public TabsBean() {
   }

   public HtmlPanelGrid getPanelGrid() {
    return panelGrid;
   }

   public void setPanelGrid(HtmlPanelGrid panelGrid) {
    this.panelGrid = panelGrid;
   }

   public void createTabs (){       


    FacesContext context = FacesContext.getCurrentInstance();
    Application application = context.getApplication();
    UITabPanel tabPanel = (UITabPanel)application.createComponent(UITabPanel.COMPONENT_TYPE);
    tabPanel.setSwitchType(SwitchType.ajax);

    for (int i=0; i<numOfTabs; i++){
        UITab tab = new UITab();
        tab = (UITab)application.createComponent(UITab.COMPONENT_TYPE);
        tab.setName("User Count "+i);
        tabPanel.getChildren().add(tab);

    }
    numOfTabs++;
    panelGrid.getChildren().clear();
    panelGrid.getChildren().add(tabPanel);
   }


}

现在我的问题是我必须添加组件这个选项卡(包含所有用户的数据表,用于插入用户的表单和其他)

我该怎么办?

2 个答案:

答案 0 :(得分:2)

如果您希望菜单打开包含特定内容的标签,最好先预先创建标签并将其隐藏,然后根据请求显示(呈现)。要创建Users,请执行以下操作:

创建User课程(如果没有)

public class User {     

    private String name;
    private String country;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getCountry() {
        return country;
    }

    public void setCountry(String country) {
        this.country = country;
    }
}

创建UserTab托管bean

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class UserTab implements Serializable {

    private List<User> users;
    private boolean rendered;

    public UserTab() {
        //Initialize list
        users = new ArrayList();

        //Initialize rendered attribute
        rendered = false;

        //Replace this for your User data retrieving method
        createDummyUsers();
    }

    private void createDummyUsers() {
        User user = new User();

        user.setName("John Doe");
        user.setCountry("USA");
        users.add(user);

        user = new User();
        user.setName("Bill Doe");
        user.setCountry("Canada");
        users.add(user);

        user = new User();
        user.setName("Winston Doe");
        user.setCountry("England");
        users.add(user);
    }

    public void showTab() {
        rendered = true;
    }

    public void hideTab() {
        rendered = false;
    }

    public List<User> getUsers() {
        return users;
    }

    public void setUsers(List<User> users) {
        this.users = users;
    }

    public boolean isRendered() {
        return rendered;
    }

    public void setRendered(boolean rendered) {
        this.rendered = rendered;
    }
}

创建一个标签处理程序:

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class TabHandler implements Serializable {

    private String activeTab;

    public TabHandler() {
        activeTab = "none";
    }

    public String getActiveTab() {
        return activeTab;
    }

    public void setActiveTab(String activeTab) {
        this.activeTab = activeTab;
    }
}

创建视图

<h:body>
        <h:form>
            <rich:panelMenu >
                <rich:panelMenuGroup >
                    <rich:panelMenuItem label="Users" name="Users" 
                                        actionListener="#{userTab.showTab()}">
                        <f:ajax event="select"
                                execute="@this"
                                render="tabPanel"
                                listener="#{tabHandler.setActiveTab('usersTab')}"/>
                    </rich:panelMenuItem>
                    <rich:panelMenuItem label="Orders" name="Orders"  />
                </rich:panelMenuGroup>
            </rich:panelMenu>


            <rich:tabPanel id="tabPanel"
                           switchType="client"
                           activeItem="#{tabHandler.activeTab}">

                <rich:tab id="mainTab">


                </rich:tab>

                <rich:tab id="usersTab"
                          rendered="#{userTab.rendered}">
                    <f:facet name="header">
                        <h:outputLabel value="Users"/>
                        <h:commandLink value="  X" actionListener="#{userTab.hideTab()}"/>
                    </f:facet>
                    <rich:dataTable value="#{userTab.users}"
                                    var="user">

                        <rich:column>
                            #{user.name}
                        </rich:column>

                        <rich:column>
                            #{user.country}
                        </rich:column>
                    </rich:dataTable>

                </rich:tab>

            </rich:tabPanel>
        </h:form>
    </h:body>

执行相同的步骤并为Order类添加所需的标记。

请参阅: RichFaces dynamic TabPanel

答案 1 :(得分:1)

如果您想通过点击添加标签,则

c:forEach不是一个选项。 你想要的是动态添加组件: