Botones de elección

Estos controles reciben también el nombre de botones de radio, como traducción directa de su denominación inglesa radio buttons y porque en general los navegadores suelen darles una forma circular. Para insertar un botón de elección usaremos de nuevo la etiqueta INPUT, pero esta vez el valor del atributo TYPE será radio:

Este tipo de controles tiene dos estados o posiciones: seleccionado (ON) o no seleccionado (OFF), estando inicialmente todos en la posición OFF. También es posible especificar que un botón determinado esté seleccionado inicialmente insertando el atributo CHECKED en la etiqueta INPUT de la siguiente manera:

Los botones de elección suelen ser insertados en los formularios en grupos, dando al usuario la posibilidad de elegir entre una serie de opciones. Cuando pulsamos sobre un botón de radio le pasamos a la posición ON y permanecerá en ese estado hasta que pulsemos en otra opción del mismo grupo. Esto es así porque entre los botones de radio de un mismo grupo sólo uno de ellos puede estar seleccionado, por tanto cuando seleccionamos uno, aquel que estuviese seleccionado previamente dejará de estarlo.

Para indicar que una serie de botones de elección pertenecen a un mismo grupo debemos incluir el mismo valor en el atributoNAME en todos ellos. Además debemos usar el atributo VALUE para dar un nombre distinto a cada uno de los botones. Veamos un ejemplo:

Con este código obtenemos el resultado que apreciamos en la figura 12.10. En ella vemos que únicamente el botón de radio correspondiente a ‘Pop’ está seleccionado. Invitamos al lector a que pruebe este ejemplo y observe cómo al seleccionar otro de los botones de elección el anterior deja de estar seleccionado.

Figura 12.10. Los botones de elección permiten elegir entre un conjunto de opciones, de las cuales podemos elegir sólo una.

Por supuesto, es posible incluir varios grupos de botones de selección dentro de un mismo formulario. Por ejemplo al código anterior podríamos añadirle (antes de </FORM>) este otro:

De esta manera tendríamos el formulario de la figura 12.11 en la que vemos que se ha podido seleccionar ‘Pop’ como tipo de música favorito y ‘Ciencia-ficción’ como género cinematográfico preferido, al pertenecer los botones a distintos grupos.

Figura 12.11. En un mismo formulario podemos incluir varios grupos de botones de elección. Los visitantes podrán seleccionar una opción en cada uno.

Quizá el lector haya tenido ya la siguiente duda. Si en las cajas de texto se manda al servidor el texto que introduzca el usuario, ¿qué se envía cuando usamos botones de elección? La respuesta es simple. Por un lado es necesario enviar el nombre del grupo (el valor del atributo NAME) y por otro la opción elegida (el valor del atributo VALUE). En el ejemplo anterior en el que se han seleccionado ‘Pop’ y ‘Ciencia- Ficción’ se enviará el siguiente mensaje:

En realidad, el mensaje que se envía no es exactamente el anterior, ya que éste es codificado. Aún así las diferencias no son muchas, y en este caso el mensaje, ya codificado, que se enviaría constaría de una única línea:musica=Pop&cine=CienciaFiccion.

Veamos un resumen de los atributos de este control:

Fuente: Copyright Jorge Ferrer, Rodrigo Garcia y Victor García, licencia Documentación Libre GNU, Versión 1.1