JSF - h: selectOneRadio

La etiqueta h: selectOneRadio representa un conjunto de elementos de entrada HTML de tipo "radio". Formatee con tablas HTML y etiquetas de etiquetas.

Etiqueta JSF

<h:selectOneRadio value = "#{userData.data}"> 
   <f:selectItem itemValue = "1" itemLabel = "Item 1" /> 
   <f:selectItem itemValue = "2" itemLabel = "Item 2" />
</h:selectOneRadio>

Salida renderizada

<table>
   <tr>
      <td>
         <input type = "radio" checked = "checked" name = "j_idt6:j_idt8" 
            id = "j_idt6:j_idt8:0" value = "1" />
         <label for = "j_idt6:j_idt8:0"> Item 1</label>
      </td>
      
      <td>
         <input type = "radio" name = "j_idt6:j_idt8" 
            id = "j_idt6:j_idt8:1" value = "2" />
         <label for = "j_idt6:j_idt8:1"> Item 2</label>
      </td>
   </tr>
</table>

Atributos de etiqueta

S. No	Atributo y descripción
1	id Identificador de un componente
2	binding Referencia al componente que se puede utilizar en un bean de respaldo
3	rendered Un booleano; falso suprime la representación
4	styleClass Nombre de clase de hoja de estilo en cascada (CSS)
5	value El valor de un componente, normalmente un valor vinculante
6	valueChangeListener Un método que se vincula a un método que responde a cambios de valor.
7	converter Nombre de la clase del convertidor
8	validator Nombre de clase de un validador que se crea y se adjunta a un componente
9	required Un booleano; si es verdadero, requiere que se ingrese un valor en el campo asociado
10	accesskey Una clave, normalmente combinada con una metaclave definida por el sistema, que le da foco a un elemento
11	accept Lista de tipos de contenido separados por comas para un formulario
12	accept-charset Lista de codificaciones de caracteres separadas por comas o espacios para un formulario. losaccept-charset El atributo se especifica con el atributo HTML JSF denominado acceptcharset.
13	alt Texto alternativo para elementos no textuales como imágenes o subprogramas
14	charset Codificación de caracteres para un recurso vinculado
15	coords Coordenadas de un elemento cuya forma es un rectángulo, círculo o polígono
dieciséis	dir Dirección del texto. Los valores válidos sonltr (de izquierda a derecha) y rtl (De derecha a izquierda)
17	disabled Estado desactivado de un elemento de entrada o botón
18	hreflang Idioma base de un recurso especificado con el href atributo; hreflang solo se puede usar con href.
19	lang Idioma base de los atributos y el texto de un elemento
20	maxlength Número máximo de caracteres para campos de texto
21	readonly Estado de solo lectura de un campo de entrada; el texto se puede seleccionar en un campo de solo lectura pero no se puede editar
22	rel Relación entre el documento actual y un enlace especificado con el href atributo
23	rev Vínculo inverso del ancla especificado con hrefal documento actual. El valor del atributo es una lista de tipos de enlaces separados por espacios
24	rows Número de filas visibles en un área de texto. h:dataTable tiene un rows atributo, pero no es un atributo de paso a través de HTML.
25	shape Forma de una región. Valores válidos:default, rect, circle, poly. (por defecto significa toda la región)
26	style Información de estilo en línea
27	tabindex Valor numérico que especifica un índice de tabulación
28	target El nombre de un marco en el que se abre un documento
29	title Un título, usado para accesibilidad, que describe un elemento. Los navegadores visuales suelen crear información sobre herramientas para el valor del título
30	type Tipo de enlace; por ejemplo,stylesheet
31	width Ancho de un elemento
32	onblur El elemento pierde el foco
33	onchange Cambios en el valor del elemento
34	onclick Se hace clic en el botón del mouse sobre el elemento
35	ondblclick El botón del mouse se hace doble clic sobre el elemento
36	onfocus El elemento recibe atención
37	onkeydown Se presiona la tecla
38	onkeypress Se presiona la tecla y luego se suelta
39	onkeyup Se suelta la llave
40	onmousedown Se presiona el botón del mouse sobre el elemento
41	onmousemove El mouse se mueve sobre el elemento
42	onmouseout El mouse sale del área del elemento
43	onmouseover El mouse se mueve sobre un elemento
44	onmouseup Se suelta el botón del mouse
45	onreset El formulario se restablece
46	onselect El texto está seleccionado en un campo de entrada
47	disabledClass Clase CSS para elementos deshabilitados
48	enabledClass Clase CSS para elementos habilitados
49	layout Especificación de cómo se distribuyen los elementos: lineDirection (horizontal) o pageDirection (vertical)
50	border Borde del elemento

Aplicación de ejemplo

Creemos una aplicación JSF de prueba para probar la etiqueta anterior.

Paso	Descripción
1	Cree un proyecto con un nombre helloworld en un paquete com.tutorialspoint.test como se explica en el capítulo JSF - Primera aplicación .
2	Modifique home.xhtml como se explica a continuación. Mantenga el resto de los archivos sin cambios.
3	Cree result.xhtml en el directorio webapps como se explica a continuación.
4	Cree UserData.java como un bean administrado en el paquete com.tutorialspoint.test como se explica a continuación.
5	Compile y ejecute la aplicación para asegurarse de que la lógica empresarial funcione según los requisitos.
6	Finalmente, compile la aplicación en forma de archivo war e impleméntela en Apache Tomcat Webserver.
7	Inicie su aplicación web utilizando la URL adecuada como se explica a continuación en el último paso.

UserData.java

package com.tutorialspoint.test;

import java.io.Serializable;

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

@ManagedBean(name = "userData", eager = true)
@SessionScoped
public class UserData implements Serializable {
   private static final long serialVersionUID = 1L;
   public String data = "1";

   public String getData() {
      return data;
   }

   public void setData(String data) {
      this.data = data;
   }
}

home.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:f = "http://java.sun.com/jsf/core"    
   xmlns:h = "http://java.sun.com/jsf/html">
   
   <head>
      <title>JSF Tutorial!</title>
   </head>
   
   <h:body>
      <h2>h:selectManyCheckbox example</h2>
      <hr />
      
      <h:form>
         <h3>Radio Button</h3> 
         <h:selectOneRadio value = "#{userData.data}">
            <f:selectItem itemValue = "1" itemLabel = "Item 1" />
            <f:selectItem itemValue = "2" itemLabel = "Item 2" />
            <f:selectItem itemValue = "3" itemLabel = "Item 3" />
            <f:selectItem itemValue = "4" itemLabel = "Item 4" />
            <f:selectItem itemValue = "5" itemLabel = "Item 5" />
         </h:selectOneRadio>	   		
         <h:commandButton value = "Submit" action = "result" />
      </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:f = "http://java.sun.com/jsf/core"    
   xmlns:h = "http://java.sun.com/jsf/html"
   xmlns:ui = "http://java.sun.com/jsf/facelets">
   
   <head>
      <title>JSF Tutorial!</title>
   </head>
   
   <h:body>
      <h2>Result</h2>
      <hr />
      #{userData.data}
   </h:body>
</html>

Una vez que esté listo con todos los cambios realizados, compilemos y ejecutemos la aplicación como lo hicimos en JSF - Capítulo Primera aplicación. Si todo está bien con su aplicación, esto producirá el siguiente resultado.

Seleccione cualquier opción y presione Submitbotón. Hemos seleccionado el elemento 3. Verá los resultados seleccionados.

↰ Previous page