Input Control Radio

el

El elemento input, con atributo type ="radio" representa una opción que pertenece a un grupo en el que no más de una opción puede ser seleccionada al mismo tiempo.

Estos grupos estan conformados por un número de botones de opción, todos comparten el mismo valor en el atributo name

Cuando el formulario es enviado solo la opción seleccionada es enviada con el formulario al agente procesador, quien no tiene otra forma de decidir qué opción ha sido seleccionada más que mirando al valor ( value) del control enviado. Este es el motivo por el cual el atributo value  de cada opción debe ser único en el grupo.

Para analizar este control plantearemos el siguiente ejemplo:

Crear un formulario que pida dos números y por medio de un control Radio, seleccionar las opciones sumar o restar los números:


<!DOCTYPE html>
<html lang="en">

<head>

    <title>Input control </title>
    <meta charset="UTF-8">

</head>
<body>
<div>
<h3>Formulario de entrada de datos</h3>
<form action="page2.php">
ingrese el primer número
<input type="text" name="numero1">
<br> 
ingrese el segundor número
<input type="text" name="numero2">
<br>
<input type="radio" name="radio1" value="suma">
sumar
<br>
<input type="radio" name="radio1" value="resta">
restar
<br>
<input type="submit" value="Enviar">
</form>
</div>
</body>
</html>

La entrada de los dos números se efectúa por medio de dos controles

<input type="text" id="numero1">

<input type="text" id="numero2">

Para seleccionar el tipo de operación a realizar disponemos de dos controles de tipo radio

<input type="radio" id="radio1" value="suma">sumar

<input type="radio" id="radio1" value="resta">restar

Es importante ver que los controles tienen el mismo nombre, esto es necesario para que el navegador sepa que los dos controles están relacionados (cuando seleccionamos uno el otro se debe deseleccionar).

Ahora veamos el código de nuestra página 2 que procesará el formulario 

    <?php
    $n1=$_POST["numero1"];
    $n2=$_POST["numero2"];
    $operacion=$_POST["radio1"];
    if($operacion ="suma"){
        $suma=$n1+$n2;
        echo "La suma es: ".$suma;
    }
    if($operacion ="resta"){
    $resta=$n1-$n2;
    echo "La resta es: ".$resta;
    
    }
    ?>

Obtenemos los datos que el usuario envía en el formulario col el siguiente código:


$n1=$_POST["numero1"];
$n2=$_POST["numero2"];
$operacion=$_POST["radio1"];


Aquí hacemos uso de la estructura condicional if  para verificar cual es la operación seleccionada


 if($operacion ="suma"){
       $suma=$n1+$n2;
        echo "La suma es: ".$suma;
    }
    if($operacion ="resta"){
    $resta=$n1-$n2;
    echo "La resta es: ".$resta;
    
    }

Si te sirvió de ayuda no olvides comentar 

Ubicación: Panamá

Comentarios

Publicar un comentario