Para el desarrollo del aprendizaje del lenguaje PHP la mejor manera de iniciar es realizando una mini calculadora. Como todo programador junior, principiante o como lo queramos llamar, debemos arrancar con cosas pequeñas pero sustanciosas, bien el objetivo final será el siguiente:
Manos a la obra, iniciemos creando nuestro formulario base, para lo cual vamos a teclear las siguientes lineas de código:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
< !DOCTYPE html>
<html lang="es"> <head> <meta charset="UTF-8"/> <title>Jugando con Php</title> </head> <body> <h2>MINI CALCULADORA CON PHP</h2> <form method="post"> <label>Número 1:</label> <input name="num1" type="text" pattern="[0-9.]+" placeholder="ingrese número 1" required autofocus/> <br /><br /><label>Número 2:</label> <input type="text" name="num2" pattern="[0-9.]+" placeholder="ingrese número 2" required/> </form> </body> </html> |
Bien, expliquemos algunas cosas hasta el momento, nuestros datos los enviaremos usando el método post, además necesitaremos 2 cajas de texto en las cuales ingresaremos los números para aplicarle las operaciones fundamentales.
Listo, cada campo lo vamos a validar de tal forma que sea obligatorio(required), que permita solo ingresar datos validos(pattern=”[0-9.]+”).
El siguiente paso es agregar los radiobutton para cada operación matemática y un botón calcular.
Listo, cada campo lo vamos a validar de tal forma que sea obligatorio(required), que permita solo ingresar datos validos(pattern=”[0-9.]+”).
El siguiente paso es agregar los radiobutton para cada operación matemática y un botón calcular.
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<br /><br /><label>Resultado:</label>
<input type="text" name="res" value="" readonly/> <br /><br /><label>SUMAR</label> <input type="radio" name="op" value="1" checked/> <label>RESTAR</label> <input type="radio" name="op" value="2"/> <label>MULTIPLICAR</label> <input type="radio" name="op" value="3"/> <label>DIVIDIR</label> <input type="radio" name="op" value="4"/> <br /><br /><input type="submit" value="CALCULAR" name="enviar"/> |
A cada radio le asignaremos un identificador, 1=sumar, 2=restar y así sucesivamente. Por defecto estará activa la opción sumar(checked), el campo resultado será de solo lectura(readonly).
Ahora hagamos el código php para resolver cada operación:
Ahora hagamos el código php para resolver cada operación:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<?php
if(isset($_POST['enviar'])){ // si damos clic al botón calcular entonces ... if($_POST['op'] === "1"){ // si esta activo el radiobutton sumar entonces ... $resul = $_POST['num1'] + $_POST['num2']; // a la variable resul le asignamos la suma de los campos } elseif($_POST['op'] === "2"){ //sino, si esta activo el radio restar entonces ... $resul = $_POST['num1'] - $_POST['num2']; } elseif($_POST['op'] === "3"){ $resul = $_POST['num1'] * $_POST['num2']; } else{ $resul = $_POST['num1'] / $_POST['num2']; } } ?> |
Finalmente, debemos modificar la propiedad value del campo resultado, editando nos quedará de la siguiente manera:
1
|
<input type="text" name="res" value="<?php if(isset($_POST['enviar'])){ echo $resul;} ?/>" readonly>
|
Listo amigos, al campo resultado le imprimimos el valor que tenga la variable resul cuando se haya dado clic al botón calcular y finalmente probemos nuestra calculadora.
Si quieres seguir aprendiendo con nosotros, puedes ingresar a nuestros
