[wp_ad_camp_5]

This post shows sample codes that uses JSF html:selectOneMenu.

Requirements

Stuff used in this post.

JSF 2.2
- javax.faces-2.2.8.jar
JDK 8

JSF Managed Bean

This is our managed bean annotated with @ManagedBean. The 3 important piece of codes here are:

@ManagedBean
Default public no-arg constructor
Setter and getter methods

[wp_ad_camp_4]

package com.turreta.jsf.bean;

import javax.faces.bean.ManagedBean;

@ManagedBean
public class MyBean {
	
	public MyBean() {}
	
	private String gender;

	public String getGender() {
		return gender;
	}

	public void setGender(String gender) {
		this.gender = gender;
	}
}

package com.turreta.jsf.bean;

import javax.faces.bean.ManagedBean;

@ManagedBean

public class MyBean {

public MyBean() {}

private String gender;

public String getGender() {

return gender;

}

public void setGender(String gender) {

this.gender = gender;

}

First Page – Request

The first page is where the drop-down boxes are displayed. Users selects one item and hits the Submit button to go to the response page.

[wp_ad_camp_3]

<!DOCTYPE html>
<html lang="en"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core">
	
	<h:head>
		<title>Please select gender</title>
	</h:head>
	<h:body>
		<h:form>
			Gender
			<h:selectOneMenu value="#{myBean.gender}">
				<f:selectItem itemLabel="[Select one]"/>
				<f:selectItem itemValue="M" itemLabel="Male"/>
				<f:selectItem itemValue="F" itemLabel="Female"/>				
			</h:selectOneMenu>
			<h:commandButton value="Submit" action="response"/>
		</h:form>
	</h:body>
</html>

<!DOCTYPE html>

<html lang="en"

xmlns="http://www.w3.org/1999/xhtml"

xmlns:h="http://xmlns.jcp.org/jsf/html"

xmlns:f="http://xmlns.jcp.org/jsf/core">

<h:head>

<title>Please select gender</title>

</h:head>

<h:body>

<h:form>

Gender

<h:selectOneMenu value="#{myBean.gender}">

<f:selectItem itemLabel="[Select one]"/>

<f:selectItem itemValue="M" itemLabel="Male"/>

<f:selectItem itemValue="F" itemLabel="Female"/>

</h:selectOneMenu>

<h:commandButton value="Submit" action="response"/>

</h:form>

</h:body>

</html>

Second Page – Response

This page displays the selected gender from the first page.

[wp_ad_camp_2]

<!DOCTYPE html>
<html lang="en"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://xmlns.jcp.org/jsf/html">
	<h:head>
		<title>Please select gender - Response</title>
	</h:head>
	<h:body>
		You're gender code is #{myBean.gender}
	</h:body>
</html>