JSF动态生成组件

         用过Servlet和JSP的开发者对动态生成组件应该是情有独钟了，可以根据数据的情况生成特定的组件，这样增大了Form的灵活性，那么JSF中如何生成动态的窗体呢，其实非常简单。主要逻辑就是通过FacesContext得到viewRoot对象，然后通过viewRoot对象的getChildren方法可以得到viewRoot下的所有第一级组件，然后分别对每个组件的getChildren方法进行递归调用，就可以得到整个组件树，当然可以对某个组件的getChildren得到的List使用add方法添加组件了，代码如下，页面有两个commandButton，其中一个可以添加一个TextBox控件，另外一个可以在console打印出当前的组件列表。 

package  net.moon;

import  java.util.List;

import  javax.faces.component.UIComponent;
import  javax.faces.component.UIViewRoot;
import  javax.faces.component.html.HtmlInputText;
import  javax.faces.context.FacesContext;

public   class  DymaComponent  ... {

    private UIViewRoot viewRoot;
    private static int inputIndex = 0;

    private List<UIComponent> getComponentChildren(UIComponent component)...{
        List<UIComponent> componentList = null;
        System.out.println(component.getId());
        if(component.getChildCount() > 0)...{
            for(UIComponent ui : component.getChildren())...{
                componentList = getComponentChildren(ui);
            }
        }
        return componentList;
    }
    
    public String getComponentsList()...{
        viewRoot = FacesContext.getCurrentInstance().getViewRoot();
        for(UIComponent component : viewRoot.getChildren())...{
            getComponentChildren(component);
        }
        return null;
    }
    
    public String addTextBox()...{
        viewRoot = FacesContext.getCurrentInstance().getViewRoot();
        UIComponent form1 = viewRoot.getChildren().get(0);
        HtmlInputText input = new HtmlInputText();
        input.setId("input" + (inputIndex++));
        input.setValue("Input 1");
        input.setRendered(true);
        form1.getChildren().add(input);
        return null;
    }
    
}

 

<% ... @ page contentType="text/html; charset=UTF-8"  %>
<% ... @ taglib uri="http://java.sun.com/jsf/html" prefix="h"  %>
<% ... @ taglib uri="http://java.sun.com/jsf/core" prefix="f"  %>

< html >
     < head >
         < meta  http-equiv ="Content-Type"  content ="text/html; charset=UTF-8" />
         < title ></ title >
     </ head >
     < body >
         < f:view >
             < h:form  id ="form1" >
                 < h:commandButton  id ="commmand1"  action ="#{dymaComponent.getComponentsList}"  value ="Print ViewRoot" ></ h:commandButton >
                 < h:commandButton  action ="#{dymaComponent.addTextBox}"  value ="Add TextBox" ></ h:commandButton >
             </ h:form >
         </ f:view >
     </ body >
</ html >

 

 

 

<? xml version="1.0" encoding="UTF-8" ?>

< faces-config
     xmlns ="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi ="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation ="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"
    version ="1.2" >
     < managed-bean >
         < managed-bean-name >
        dymaComponent </ managed-bean-name >
         < managed-bean-class >
        net.moon.DymaComponent </ managed-bean-class >
         < managed-bean-scope >
        session </ managed-bean-scope >
     </ managed-bean >

</ faces-config >