JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
Advertise
Contact Us
Write For Us
RSS feed
Home
All Tutorials
Java Core
JSF
Spring
Hibernate
Struts
Android
Others
JSF 2 Radio Buttons Example
Posted on October 13, 2010 , By mkyong Last modified : August 29, 2012
In JSF, h:selectOneRadio tag is used to render a set of HTML input element of type radio, and format it with HTML table and label tag.
//JSF... <h:selectOneRadio value="#{user.favColor1}"> <f:selectItem itemValue="Red" itemLabel="Color1 - Red" /> <f:selectItem itemValue="Green" itemLabel="Color1 - Green" /> <f:selectItem itemValue="Blue" itemLabel="Color1 - Blue" /> </h:selectOneRadio> //HTML output... <table> <tr> <td> <input type="radio" name="j_idt6:j_idt8" id="j_idt6:j_idt8:0" value="Red" /> <label for="j_idt6:j_idt8:0"> Color1 - Red</label></td> <td> <input type="radio" name="j_idt6:j_idt8" id="j_idt6:j_idt8:1" value="Green" /> <label for="j_idt6:j_idt8:1"> Color1 - Green</label></td> <td> <input type="radio" name="j_idt6:j_idt8" id="j_idt6:j_idt8:2" value="Blue" /> <label for="j_idt6:j_idt8:2"> Color1 - Blue</label> </td> </tr> </table>
JSF 2.0 h:selectOneRadio example
A JSF 2.0 example to show the use of h:selectOneRadio tag to render radio buttons, and populate the data in 3 different ways : 1. Hardcoded values in f:selectItem tag. 2. Generate values with a Map and put it into f:selectItems tag. 3. Generate values with an Object array and put it into f:selectItems tag, then represent the value with a var attribute.
1. Backing Bean
A backing bean to hold the submitted data.
package com.mkyong; import java.util.LinkedHashMap; import java.util.Map; import javax.faces.bean.ManagedBean; import javax.faces.bean.SessionScoped; @ManagedBean(name="user") @SessionScoped public class UserBean{ public String favColor1; public String favColor2; public String favColor3; //getter and setter methods //Generated by Map private static Map<String,Object> color2Value; static{ color2Value = new LinkedHashMap<String,Object>(); color2Value.put("Color2 - Red", "Red"); //label, value color2Value.put("Color2 - Green", "Green");
1 de 6
19/09/2013 14:56
JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
color2Value.put("Color3 - Blue", "Blue"); } public Map<String,Object> getFavColor2Value() { return color2Value; } //Generated by Object array public static class Color{ public String colorLabel; public String colorValue; public Color(String colorLabel, String colorValue){ this.colorLabel = colorLabel; this.colorValue = colorValue; } public String getColorLabel(){ return colorLabel; } public String getColorValue(){ return colorValue; } } public Color[] color3List; public Color[] getFavColor3Value() { color3List = new Color[3]; color3List[0] = new Color("Color3 - Red", "Red"); color3List[1] = new Color("Color3 - Green", "Green"); color3List[2] = new Color("Color3 - Blue", "Blue"); return color3List; } }
2. JSF Page
A JSF page to demonstrate the use h:selectOneRadio tag.
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" > <h:body> <h1>JSF 2 radio button example</h1> <h:form> 1. Hard-coded with "f:selectItem" : <h:selectOneRadio value="#{user.favColor1}"> <f:selectItem itemValue="Red" itemLabel="Color1 - Red" /> <f:selectItem itemValue="Green" itemLabel="Color1 - Green" /> <f:selectItem itemValue="Blue" itemLabel="Color1 - Blue" /> </h:selectOneRadio> <br /> 2. Generated by Map : <h:selectOneRadio value="#{user.favColor2}"> <f:selectItems value="#{user.favColor2Value}" /> </h:selectOneRadio> <br /> 3. Generated by Object array and iterate with var : <h:selectOneRadio value="#{user.favColor3}"> <f:selectItems value="#{user.favColor3Value}" var="c" itemLabel="#{c.colorLabel}" itemValue="#{c.colorValue}" /> </h:selectOneRadio> <br />
2 de 6
19/09/2013 14:56
JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
<h:commandButton value="Submit" action="result" /> <h:commandButton value="Reset" type="reset" /> </h:form> </h:body> </html>
result.xhtml
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" > <h:body> <h1>JSF 2 radio button example</h1> <h2>result.xhtml</h2> <ol> <li>user.favColor1 : #{user.favColor1}</li> <li>user.favColor2 : #{user.favColor2}</li> <li>user.favColor3 : #{user.favColor3}</li> </ol> </h:body> </html>
3. Demo
When submit button is clicked, link to result.xhtml and display the submitted radio button values.
3 de 6
19/09/2013 14:56
JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
How to select radio button value by default?
In JSF, the radio button values of f:selectItems tag is selected if it matched to the value of h:selectOneRadio tag. In above example, if you set favColor2 to Red :
@ManagedBean(name="user") @SessionScoped public class UserBean{ public String[] favColor = "Red"; //...
The favColor2 radio button, Red option is selected by default.
Download Source Code
Download It JSF-2-RadioButtons-Example.zip (10KB)
Reference
1. JSF <h:selectOneRadio /> JavaDoc Tags : jsf2 radio button
mkyong
Founder of Mkyong.com, love Java and open source stuffs. Follow him on Twitter, or befriend him on Facebook or Google Plus.
Here are some of my favorite books
Head First Java
Design Pattern
Effective Java
Spring Recipes
JavaScript Ninja
Related Posts
PrimeFaces hello world example How to get ServletContext in JSF 2 How to trigger a Quartz job manually (JSF 2 example) JSF 2 + Quartz 2 example
Popular Posts
Top 8 Java People You Should Know Top 20 Java Websites Top 5 Free Java eBooks Top 10 Java Regular Expression Examples
4 de 6
19/09/2013 14:56
JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
Google App Engine + JSF 2 example
Top 5 Open Source Q&A Systems
You might also like following tutorials :
Ninad
I want to unselect the radio button when I click on a already selected radio button. Is it possible.
August 9, 2013 at 5:52 am
abdel
December 7, 2012 at 1:08 am
Hello, why static methods ? I want to cotrol a fields but i cant use method no static methode whithin static declartion
hossein
yong mook kim thank you . i am hossein from iran .
September 1, 2012 at 6:37 pm
marky
how can i deselect a selection?
May 22, 2012 at 4:42 am
ugo
Watch out, the attribute value doesnt exist for f:selectItem, you better use itemValue.
January 10, 2012 at 12:53 am
vikas
it is possible to show a text box in between group radio buttons in jsf
December 2, 2011 at 2:58 pm
What is your opinion?
Your email address will not be published. Required fields are marked * Name * Email * Website
5 de 6
19/09/2013 14:56
JSF 2 radio buttons example
http://www.mkyong.com/jsf2/jsf-2-radio-buttons-example/
Comment
Note To post source code in comment, uses <prelang="java">sourcecode</pre>
Notify me of followup comments via e-mail
All Available Tutorials
Favorites Links
Friends & Links
About Us
Java Core Technologies : Java I/O, Java RegEx, Java XML, Java JSON, JDBC, Java Misc J2EE Frameworks : Hibernate, JSF 2.0, Spring Core, Spring MVC, Spring Security, Spring MongoDB, Spring BatchApache Wicket, Struts 1.x, Struts 2.x Web Service : JAX-WS (SOAP), JAX-RS (REST) Build Tools : Maven, Archiva Unit Test Frameworks : jUnit, TestNG Others : Android, Google App Engine, jQuery, Java MongoDB, Quartz Scheduler
Android Developer Google App Engine using Java DZone - Fresh Links Official Java EE 5 Tutorial Official Java EE 6 Tutorial Spring 2.5.x documentation Spring 3.2.x documentation Hibernate core documentation Java SE 6.0 API documentation Java EE 6.0 API documentation Java Secure Socket Extension (JSSE) Reference Guide JSP home page JSF home page Eclipse IDE for Java developer Struts 1.3 documentation Struts 2.2 documentation Maven home page Maven central repository Search Java.Net Maven repository Ant home page JAX-WS Official Website JAX-RS Official Website (Jersey) MongoDB Official Website
Java Code Geeks PHP Tutorials TenthOfMarch Web Security Blog Web Development
Mkyong.com is a weblog dedicated to Java/J2EE developers and Web Developers. We constantly publish useful tricks, tutorials on J2EE or web development. All examples are simple, easy to read, and full source code available, and of course well tested in our development environment. We're Social 1. Twitter - Follow Me 2. Facebook - Like Me 3. Google Plus - Add Me 4. RSS - Subscribe Me
Copyright 2008-2013 Mkyong.com, all rights reserved. Web Hosting Powered by Liquid Web
6 de 6
19/09/2013 14:56
