JavaBeat

Java Tutorial Blog

JSF 2 SelectOneRadio Example

//  by 

The selectOneRadio component is one of the most component that already had provided in JSF 1 and included in the JSF 2. Radio buttons are implemented in the JavaServer Faces using the selectOneRadio that translated into <input type=”radio”/> while the HTML gets rendition. The selectOneRadio isn’t consider as a replacement for selectBooleanCheckbox, cause the latter doesn’t enforce one selection, but the selectOneRadio component does enforce the user to select one option inherently.

The main attribute of selectOneRadio is the value attribute that is associated (binded) into bean property. SelectOneRadio does provide the ability to populate the selections through <f:selectItem/> or <f:selectItems/> JSF component. JSF 2 has provided a new attributes that not included at the JSF 1; collectionType, hideNoSelectionOption, enabledClass, disabledClass, selectedClass and unselectedClass are newly added attributes for selectOneRadio.

Also Read:

1. Managed Bean

SelectOneRadioBean.java

package net.javabeat.jsf;

import java.util.ArrayList;
import java.util.List;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@SessionScoped
public class SelectOneRadioBean {

	private List<Tutorial> tutorials = new ArrayList<Tutorial>();

	private String selectedTutorial = new String();

	public SelectOneRadioBean() {
		this.tutorials.add(new Tutorial(1,"JSF 2"));
		this.tutorials.add(new Tutorial(2,"EclipseLink"));
		this.tutorials.add(new Tutorial(3,"HTML 5"));
		this.tutorials.add(new Tutorial(4,"Spring"));
	}

	public String register() {
		return "registrationInfo";
	}

	public List<Tutorial> getTutorials() {
		return tutorials;
	}

	public void setTutorials(List<Tutorial> tutorials) {
		this.tutorials = tutorials;
	}

	public String getSelectedTutorial() {
		return selectedTutorial;
	}

	public void setSelectedTutorial(String selectedTutorial) {
		this.selectedTutorial = selectedTutorial;
	}
}

Tutorial.java

package net.javabeat.jsf;

public class Tutorial {
	private int tutorialId;
	private String tutorialDescription;

	public Tutorial(int id, String desc){
		this.tutorialId = id;
		this.tutorialDescription = desc;
	}

	public int getTutorialId() {
		return tutorialId;
	}
	public void setTutorialId(int tutorialId) {
		this.tutorialId = tutorialId;
	}
	public String getTutorialDescription() {
		return tutorialDescription;
	}
	public void setTutorialDescription(String tutorialDescription) {
		this.tutorialDescription = tutorialDescription;
	}
}

2. The Views

selectOneRadio.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
<h:form>
	<h1>
		<h:outputText value="JavaBeat JSF 2.2 Examples" />
	</h1>
	<h2>
		<h:outputText value="SelectOneRadio Example" />
	</h2>
	<h:outputText value="Select Tutorials:" />
	<h:selectOneRadio value="#{selectOneRadioBean.selectedTutorial}">
		<f:selectItems var="tutorial" value="#{selectOneRadioBean.tutorials}"
						itemValue="#{tutorial.tutorialId}" itemLabel="#{tutorial.tutorialDescription}"/>
	</h:selectOneRadio>
	<h:commandButton value="Register"
		action="#{selectOneRadioBean.register}"></h:commandButton>
</h:form>
</html>

registrationInfo.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
	<f:view>
		<h1><h:outputText value="JavaBeat JSF 2.2 Examples" /></h1>
		<h2><h:outputText value="SelectOneRadio Example" /></h2>
		<h:form>
			<h:outputText value="Selected Tutorial: "/>
			<br/>
			<h:outputText value="Tutorial Id : #{selectOneRadioBean.selectedTutorial}"/>
		</h:form>
	</f:view>
</html>

3. The Deployment Descriptor (web.xml)

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
	id="WebApp_ID" version="2.5" metadata-complete="true">
	<context-param>
		<description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
		<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
		<param-value>client</param-value>
	</context-param>
	<context-param>
		<param-name>javax.faces.application.CONFIG_FILES</param-name>
		<param-value>/WEB-INF/faces-config.xml</param-value>
	</context-param>
	<servlet>
		<servlet-name>Faces Servlet</servlet-name>
		<servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>/faces/*</url-pattern>
	</servlet-mapping>
	<servlet-mapping>
		<servlet-name>Faces Servlet</servlet-name>
		<url-pattern>*.xhtml</url-pattern>
	</servlet-mapping>
	<listener>
		<listener-class>com.sun.faces.config.ConfigureListener</listener-class>
	</listener>
</web-app>

4. JSF 2 SelectOneRadio Demo

The below snapshots show you a complete scenario of using SelectOneRadio component.

JSF 2 SelectOneRadio Example 1

JSF 2 SelectOneRadio Example 2

[wpdm_file id=9]

About Amr Mohammed