JSF rendered component not binding with ajax call - jsf

Question

I need help to render a component that will in turn make an ajax call after it has been rendered but with no success.
I have the following code which doesn't work. I don't know if I am missing something. Any help is highly appreciated.
<h:selectOneMenu id="gender" value="#{bean.gender}"
class="form-control"
valueChangeListener="#{bean.updateGenderValue}"
onchange="submit()">
<f:selectItems value="#{bean.genders}" var="gender" itemLabel="#
{gender}" itemValue="#{gender}"/>
</h:selectOneMenu>
<h:selectOneMenu value="#{bean.pregnancyStatus}"
class="form-control"
rendered="#{bean.gender eq 'Female'}">
<f:selectItems value="#{bean.options}"
var="pregnancyStatus" itemLabel="#{pregnancyStatus}"
itemValue="#{pregnancyStatus}"/>
<f:ajax listener="#{bean.updatePregancyValue}"
execute="#this" render="#this"/>
</h:selectOneMenu>
public void updateGenderValue(ValueChangeEvent event) throws IOException {
gender = (String) event.getNewValue();
}
public void updatePregancyValue(AjaxBehaviorEvent event) throws IOException {
System.out.println(":( == " + pregnancyStatus);
}
The pregnancyStatus value is never updated at all.

Answer 1

Did you missed the <h:form>? I copied and pasted your code in my project and
my code:
<div style="height:500px">
<h:form>
<h:selectOneMenu id="gender" value="#{bean.gender}"
class="form-control"
valueChangeListener="#{bean.updateGenderValue}"
onchange="submit()">
<f:selectItems value="#{bean.genders}" var="gender" itemLabel="#
{gender}" itemValue="#{gender}"/>
</h:selectOneMenu>
<h:selectOneMenu value="#{bean.pregnancyStatus}"
class="form-control"
rendered="#{bean.gender eq 'Female'}">
<f:selectItems value="#{bean.options}"
var="pregnancyStatus" itemLabel="#{pregnancyStatus}"
itemValue="#{pregnancyStatus}"/>
<f:ajax listener="#{bean.updatePregancyValue}"
execute="#this" render="#this"/>
</h:selectOneMenu>
lets check the console :
:( == 2
:( == 3
Bean:
#ManagedBean(name = "bean")
#ViewScoped
public class Bean {
private String pregnancyStatus;
private List<SelectItem> options;
private List<SelectItem> genders;
private String gender;
#PostConstruct
public void initBean(){
options = new ArrayList<>();
genders = new ArrayList<>();
options.add(new SelectItem("1"));
options.add(new SelectItem("2"));
options.add(new SelectItem("3"));
genders.add(new SelectItem("Male"));
genders.add(new SelectItem("Female"));
genders.add(new SelectItem("third"));
}
public String getPregnancyStatus() {
return pregnancyStatus;
}
public void setPregnancyStatus(String pregnancyStatus) {
this.pregnancyStatus = pregnancyStatus;
}
public void updateGenderValue(ValueChangeEvent event) throws IOException {
gender = (String) event.getNewValue();
}
public void updatePregancyValue(AjaxBehaviorEvent event) throws IOException {
System.out.println(":( == " + pregnancyStatus);
}
}