Question

My requirement is like this. I have a selectMenu with some values (Examples: Engineering, Medicine, Law etc..,) . Suppose if I select Engineering in the drop down, I want another dropdown menu created dynamically which has values related to Engineering (Example: Electronics, Computers, Electricals etc..,). How do I achieve this in JSF 2.0 ?

Was it helpful?

Solution

You need to perform an ajax request when first h:selectOneMenu's selection change. This request will update the selectable items in the second h:selectOneMenu. After the ajax request, you must render the second h:selectOneMenu again, with the updated values.

Page:

<h:selectOneMenu value="#{bean.selectedSubject}">
    <f:ajax listener="#{bean.changeSubject}" render="speciality_selection" />
    <f:selectItems value="#{bean.subject}" />
</h:selectOneMenu>

<h:selectOneMenu id="speciality_selection" value="#{bean.selectedSpeciality}">
    <f:selectItems value="#{bean.subjectSpecialities}" />
</h:selectOneMenu>

Managed bean:

public void changeSubject(){
    //Loads the specialities depending on the selected subject
    subjectSpecialities = loadSpecialitiesForSubject(selectedSubject);
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top