Controles Visuales en Formularios (1-7)

 

Control Radio

            Estos tipos de controles permiten la selección de un único valor.

Ejemplo Práctico: Desarrollar un programa que permita en el servidor realizar la suma, resta, multiplicación o división de dos enteros.

Pantalla solicitada:

R1

Proceso: Incluir los dos text para la carga de los dos enteros, cuatro controles de tipo radio para permitir la selección de la operación y el botón submit para el envío de los datos al servidor.

Implementación (Radio.htm):

<html>
<head>
</head>
<body>
<form name="form1" method="post" action="Radio.php">
Ingrese primer valor:
<input type="text" name="text1">
<br>
Ingrese segundo valor:
<input type="text" name="text2">
<br>
<input type="radio" name="radio1" value="sumar">
Sumar
<br>
<input type="radio" name="radio1" value="restar">
Restar
<br>
<input type="radio" name="radio1" value="multiplicar">
Multiplicar
<br>
<input type="radio" name="radio1" value="dividir">
Dividir
<br>
<input type="submit" name="boton1" value="operar">
</form>
</body>
</html>

Explicación:

En el formulario los controles de tipo radio se definen:

<input type="radio" name="radio1" value="sumar">
<input type="radio" name="radio1" value="restar">
etc.
Lo importante es notar que todos los objetos de tipo radio tienen el mismo nombre, con ello se indica que cuando el operador selecciona uno, se debe desmarcar el seleccionado actualmente.

Si queremos que uno de los radios comience seleccionado, al mismo, le agregamos la palabra checked:
<input type="radio" name="radio1" value="sumar" checked>