ProgWebII-Sem5-FormAutos

PROGRAMACION WEB II
SEMANA 5
Esteban Tundidor
09 de octubre de 2022
Ingeniería en Informática
DESARROLLO
1.- Respuesta:
Desarrollo código para realizar lo solicitado en el primer punto, se crea formulario con sus respectivas
características.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Semana 5</title>
</head>
<body>
<form name="formulario" method="post" action="autos.php">
<table>
<caption>Datos del Vehiculo</caption>
<tr>
<td>Matricula:</td>
<td><input type="text" name="matricula" size="40" onkeyup=validar(this); data-

lengthMin="2"
placeholder='Colocar 6 caracteres' required></td>
</tr>
<tr>
<td>Serie del motor</td>
<td><input type="text" name="seriemotor" size="40" data-lengthMin="10" required></td>
</tr>
<tr>
<td>Serie de la Carroceria:</td>
<td><input type="text" name="carroceria" size="40" minlength='10'></td> </tr>
<tr>
<td>Marca:</td>
<td><input type="text" name="marca" size="40" minlength='2'></td> </tr>
<tr>
<td>Modelo:</td>
<td><input type="text" name="modelo" size="40" minlength='4'></td> </tr>
<tr>
<td>Año:</td>
<td><input type="text" name="anio" size="40" onkeyup=validar(this); data-lengthMin="2"
placeholder='Corresponde a 4 digitos' required></td>
</tr>
<tr>
<td>Color:</td>
<td><input type="text" name="color" size="40" minlength='4'></td>
</tr>
<tr>
<td>Precio:</td>
<td><input type="text" name="precio" size="40" minlength='4'></td> </tr>
<tr>
<td><input type="submit" name="ingresar" value="Ingresar"></td>
</tr>
</table>
</form>
<script src="js/validar.js"></script>
</body>
</html>
2.- Respuesta
Se genera el código JavaScript para validar el formulario siendo este el que nos permitirá poder informar
al usuario si los objetivos deseados o requeridos no se cumplen al llenar una casilla del formulario,
function validar(element){
const min=parseInt(element.dataset.lengthmin);
if(element.value.length>=min){
element.classList.remove("borderRed");
return true;
}else{
alert("Ingresa el minimo de caracteres por favor");
element.classList.add("borderRed");
return false;}
function validarFormulario(formulario){
let result=true;
const input=formulario.querySelectorAll("input[type=text]");
for (i of input){
if (validar(i)==false){
result=false;}
}return result;}
En pantalla se observa de la siguiente manera:

3.-Respuesta:
Se realiza el código PHP para visualizar el formulario:
Código:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<?php
Class Autos{
private $matricula;
private $seriemotor;
private $carroceria;
private $marca;
private $modelo;
private $anio;
private $color;
private $precio;
public function setMatricula($matricula){

$this->matricula = $matricula;
}
public function getMatricula(){
return $this->matricula;
}
public function setSeriemotor($seriemotor){
$this->seriemotor;
}
public function getSeriemotor(){
return $this->seriemotor;
}
public function setCarroceria($carroceria){
$this->carroceria = $carroceria;
}
public function getCarroceria(){
return $this->carroceria;
}
public function setMarca($marca){
$this->marca = $marca;
}
public function getMarca(){
return $this->marca;
}
public function setModelo($modelo){
$this->modelo = $modelo;
}
public function getModelo(){
return $this->modelo;
}
public function setAnio($anio){
$this->anio = $anio;
}
public function getAnio(){
return $this->anio;
}
public function setColor($color){
$this->color = $color;
}
public function getColor(){
return $this->color;
}
public function setPrecio($precio){
$this->precio = $precio;
}
public function getPrecio(){
return $this->precio;
}
}
$matricula = $_POST['matricula']; $seriemotor = $_POST['seriemotor']; $carroceria

= $_POST['carroceria'];
$marca = $_POST['marca']; $modelo = $_POST['modelo']; $anio = $_POST['anio'];

$color = $_POST['color'];
$precio = $_POST['precio'];
$objeto = new Autos();
$objeto->setMatricula($matricula);
$objeto->setSeriemotor($seriemotor);
$objeto->setCarroceria($carroceria);
$objeto->setMarca($marca);
$objeto->setModelo($modelo);
$objeto->setAnio($anio);
$objeto->setColor($color);
$objeto->setPrecio($precio);
echo "<br/><br/>";
echo "<b>Datos del Vehiculo</b></b>";
echo "Matricula: ".$objetoAuto->getMatricula()."<br/>";
echo "Serie de Motor: ". $objetoAuto->getSeriemotor()."<br/>";
echo "Serie de Carroceria: ". $objetoAuto->getCarroceria()."<br/>";
echo "Marca: ".$objetoAuto->getMarca()."<br/>";
echo "Modelo: ".$objetoAuto->getModelo()."<br/>";
echo "Año: ".$objetoAuto->getAnio()."<br/>";

echo "Color: ".$objetoAuto->getColor()."<br/>";
echo "Precio: ".$objetoAuto->getPrecio()."<br/><br/>";
echo "<a href='FormularioAutos.html'>Regresar al formulario</a>";
?>
</body>
</html>
Vista en pantalla:
REFERENCIAS BIBLIOGRÁFICAS
IACC. (2020). PHP, MYSQL. Programación Web II. Semana 5

ProgWebII-Sem5-FormAutos

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

ProgWebII-Sem5-FormAutos

Cargado por

Copyright:

Formatos disponibles

PROGRAMACION WEB II

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<form name="formulario" method="post" action="autos.php">

<caption>Datos del Vehiculo</caption>

<td><input type="text" name="matricula" size="40" onkeyup=validar(this); data-

placeholder='Colocar 6 caracteres' required></td>

<td>Serie del motor</td>

<td><input type="text" name="seriemotor" size="40" data-lengthMin="10" required></td>

<td><input type="text" name="marca" size="40" minlength='2'></td> </tr>

<td><input type="text" name="modelo" size="40" minlength='4'></td> </tr>

<td><input type="text" name="anio" size="40" onkeyup=validar(this); data-lengthMin="2"

placeholder='Corresponde a 4 digitos' required></td>

<td><input type="text" name="color" size="40" minlength='4'></td>

<td><input type="text" name="precio" size="40" minlength='4'></td> </tr>

<td><input type="submit" name="ingresar" value="Ingresar"></td>

alert("Ingresa el minimo de caracteres por favor");

En pantalla se observa de la siguiente manera:

Se realiza el código PHP para visualizar el formulario:

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

public function setMatricula($matricula){

public function getMatricula(){

public function setSeriemotor($seriemotor){

public function getSeriemotor(){

public function setCarroceria($carroceria){

public function getCarroceria(){

public function setMarca($marca){

public function getMarca(){

public function setModelo($modelo){

public function getModelo(){

public function setAnio($anio){

public function getAnio(){

public function setColor($color){

public function getColor(){

public function setPrecio($precio){

$matricula = $_POST['matricula']; $seriemotor = $_POST['seriemotor']; $carroceria

$marca = $_POST['marca']; $modelo = $_POST['modelo']; $anio = $_POST['anio'];

$objeto = new Autos();

echo "Matricula: ".$objetoAuto->getMatricula()."<br/>";

echo "Serie de Motor: ". $objetoAuto->getSeriemotor()."<br/>";

echo "Serie de Carroceria: ". $objetoAuto->getCarroceria()."<br/>";

echo "Marca: ".$objetoAuto->getMarca()."<br/>";

echo "Modelo: ".$objetoAuto->getModelo()."<br/>";

echo "Año: ".$objetoAuto->getAnio()."<br/>";

echo "Precio: ".$objetoAuto->getPrecio()."<br/><br/>";

echo "<a href='FormularioAutos.html'>Regresar al formulario</a>";

IACC. (2020). PHP, MYSQL. Programación Web II. Semana 5

También podría gustarte