Conditionally render other component when radiobutton is changed

Question

I am trying to display a menu if a radiobutton is selected. I'm using the rendered attribute for this purpose.

Model:

private int type; // +getter+setter

View:

<h:selectOneRadio value="#{bean.type}">
    <f:selectItem itemLabel="A" itemValue="1"/>
    <f:selectItem itemLabel="B" itemValue="2"/>
</h:selectOneRadio>
<h:form id="formMention" rendered="#{bean.type == 1}">
    <h:selectOneMenu ...>
        <f:selectItems ... />
    </h:selectOneMenu>
</h:form>

Nothing shows when I check A. How can I achieve this?

Answer 1

Normally, you'd grab ajax for this, but as you're apparently on dead JSF 1.x, which lacks ajax fanciness, you're resorted to "plain" HTML/JS as long as you don't want to introduce an ajax capable component library. One of the ways is just submitting the form outright on click of the radio button.

<h:form>
    <h:selectOneRadio value="#{bean.type}" onclick="this.form.submit()">
        <f:selectItem itemLabel="A" itemValue="1"/>
        <f:selectItem itemLabel="B" itemValue="2"/>
    </h:selectOneRadio>
</h:form>
<h:form id="formMention">
    <h:selectOneMenu ... rendered="#{bean.type == 1}">
        <f:selectItems ... />
    </h:selectOneMenu>
</h:form>