Dynamically add the component in JSF?

Question

In my application the component has to change dynamically. I am having a Datatable in that i am having two column, first is a <h:selectoneMenu> in the menu i am having two data(the data are 1 and 2) if 1 is selected then a <h:inputText> should appear and if 2 is selected <h:selectoneMenu> should appear. Need help to do this?

My JSF

   <h:selectOneMenu id="menu" value="#{sample.data}" rendered="true" valueChangeListener="#{sample.change}">
    <f:selectItem itemLabel="Data" itemValue=""/>
    <f:selectItems value="#{sample.list1}"/>
            <a4j:support event="onchange" reRender="text" />
</h:selectOneMenu>
<h:inputText id="text" value="#{sample.input}" rendered="#{sample.status}" />

My Manged Bean Class

public class Sample {
private Boolean status;          //Getter & Setter
private List<SelectItem> list1;  //Setter
private String input;            //Getter & Setter
private String data;             //Getter & Setter

public void change(ValueChangeEvent event){
System.out.println((String)event.getNewValue());
if(((String)event.getNewValue()).equals("value1")){
    status=true;
}
else if(((String)event.getNewValue()).equals("value2")){
    status=false;
}
}
public Boolean getStatus(){
if(status==null){
    status=true;
}
return status;
}
public List<SelectItem> getList1() {
if(list1==null) {
list1 = new ArrayList<SelectItem>();
list1.add(new SelectItem("value1", "label1"));
list1.add(new SelectItem("value2", "label2"));
}
return list1;
}
}

score 5 · Accepted Answer · answered Feb 19 '10 at 11:26

5

My advice would be: do not add/remove component dynamically. Solve your problem another way:

Toggle visibility of components
Rebind the data belonging to a component

Adding/removing component dynamically is always a source of trouble and chances are that you can do it another way much simpler.

In your case, playing with the visibility using rendered attribute should be enough.

answered Feb 19 '10 at 11:26

ewernli

38,045
5
92
123

As ewernli said you have to render again the component you want to be changed. You can do this by reloading the full page or by reloading the component you want using AJAX. We should have more info of what component library are you using for giving you a more detailed answer. – Averroes Feb 19 '10 at 12:32
i am using jsf2.0 and richfaces for ajax support – Hariharbalaji Feb 19 '10 at 12:43

Averroes · Answer 2 · 2010-02-19T12:55:38.553

Let's say you have something like this

<h:selectoneMenu id="selectOne" rendered="#{myBean.selectOneRendered}">
<h:inputText id="input" rendered="#{!myBean.selectOneRendered}">

You have both the components in your jsp page. Once you reload the jsp the rendered prorpertie will be checked.

in your myBean you must to have something like this

public boolean isSelectOneRendered(){
 boolean rendered;
 //Do something here
 return rendered;
}

if the result is true then the selectOne will be rendered and the input will not and the other way round.

Dynamically add the component in JSF?

2 Answers2

Linked