jsfrendered-attribute

Rendered Attibute not working


I have a JSF page with a selectOneMenu and an inputText.

The inputText need apears only with some option is selected on selectOneMenu.

Here is the JSF code:

        <span>
            <h:selectOneMenu id="select" value="#{myBean.model.selectValue}" >
                <f:selectItem itemValue="1" itemLabel="1" />
                <f:selectItem itemValue="2" itemLabel="2" />
                <f:selectItem itemValue="3" itemLabel="3" />
                <f:ajax listener="#{myBean.showInput}" render="input" />
            </h:selectOneMenu>
        </span>
        <span>
            <h:inputText id="input" value="#{myBean.model.inputValue}" rendered="#{myBean.input}"/>
        </span>

Here is MyBean code:

@ManagedBean(name = "myBean")
public class MyBean {

    public class Model {

        private String selectValue = "";
        private String inputValue = "";

        public String getInputValue() {
            return inputValue;
        }

        public void setInputValue(String inputValue) {
            this.inputValue = inputValue;
        }

        public String getSelectValue() {
            return selectValue;
        }

        public void setSelectValue(String selectValue) {
            this.selectValue = selectValue;
        }
    }

    private Model model = new Model();
    private boolean input = false;

    public Model getModel() {
        return model;
    }

    public void setModel(Model model) {
        this.model = model;
    }

    public boolean isInput() {
        return input;
    }

    public void setInput(boolean input) {
        this.input = input;
    }

    public void showInput() {
        this.input = "3".equals(model.getSelectValue());
    }

}

But the input is never showing. No matter which is selected on selectOneMenu.

What I'm missing?


Solution

  • #{myBean.input} is initially false, so the component isn't rendered when the page is loaded. You'll have to target the parent container of h:inputText from f:ajax, because once the rendered attribute is false, that input text is no longer in the component tree and can't be re-rendered. Try this

        <span>
            <h:selectOneMenu id="select" value="#{myBean.model.selectValue}" >
                <f:selectItem itemValue="1" itemLabel="1" />
                <f:selectItem itemValue="2" itemLabel="2" />
                <f:selectItem itemValue="3" itemLabel="3" />
                <f:ajax listener="#{myBean.showInput}" render="wrapper" />
            </h:selectOneMenu>
        </span>
        <span>
            <h:panelGroup id="wrapper">
                <h:inputText id="input" value="#{myBean.model.inputValue}" rendered="#{myBean.input}"/>
            </h:panelGroup>
        </span>