TALLER 1_U2
12 de Julio del 2020
Programación Web
Nombre: Edison Paul Paca Morocho
 Diagrama de Navegación
 Moqups de diseño de Pantalla
 Código Fuente del CRUD de la tabla Menú
CREATE
<?php
//conexion a la base de datos
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "barespel";
$conn = new mysqli($servername, $username, $password, $dbname);
if (isset($_POST["men_nombre"])) {
$bar_id=$_POST["bar_id"];
$men_nombre=strtoupper($_POST["men_nombre"]);
$men_precio=$_POST["men_precio"];
$men_disponible=$_POST["men_disponible"];
$men_descripcion=$_POST["men_descripcion"];
// Create connection
$sql = "INSERT INTO menu (men_id,bar_id,men_nombre,men_precio,men_disponible,men_descrip
cion) VALUES(0,".$bar_id.",'".$men_nombre."',".$men_precio.",".$men_disponible.",'".$men_descrip
cion."')";//* es para seleccionar todos los datos de la tabla bar
ECHO $sql;
$conn->query($sql);
$conn->close();
header("Location: index.php");
}
$sql = "SELECT * FROM bar ORDER BY bar_nombre";//* es para seleccionar todos los datos de la
tabla bar
$result_bar = $conn->query($sql);
$conn->close();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Crear Menu</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra
p.min.css" integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<!-- Logo y contacto-->
<header class="nav nav-pills nav-fill" style="background-
color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" >
<li class="nav-item" style="text-align: left;">
<h1>GESTION DE BAR ESPE-L</h1>
<p class="sub">Gestione locales, menus, sugerencias y preferencias</p>
</li>
<li class="nav-item" style="text-align: right; padding-top: 23px">
<a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a>
</li>
</header>
<div class="container" >
<div class="row">
<div class="col">
<br>
<h1 class ="text-center">CREAR MENU</h1>
</div>
</div>
<form action="create.php"method="POST">
<div class="row border">
<div class="col">
<div class="form-group">
<label for="bar_id">Locales</label>
<select class="custom-select"id="bar_id" name="bar_id">
<?php while($row=$result_bar-> fetch_assoc()){ ?>
<option value="<?php echo $row["bar_id"]?>"><?php echo $row["bar_nom
bre"]?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<label for="men_nombre">Nombre</label>
<input type="text" class="form-
control" id="men_nombre" name="men_nombre" required>
</div>
<div class="form-group">
<label for="men_nombre">Precio</label>
<input type="text" class="form-
control" id="men_precio" name="men_precio" required>
</div>
<div class="form-group">
<label for="men_disponible">Disponible</label>
<input type="radio" class="form-
control" id="men_disponible" name="men_disponible" value="1">
<label for="sna_disponible">Agotado</label>
<input type="radio" class="form-
control" id="men_disponible" name="men_disponible" value="0">
</div>
<div class="form-group">
<label for="men_descripcion">Descripcion</label>
<input type="text" class="form-
control" id="men_descripcion" name="men_descripcion">
</div>
</div>
</div>
<div class="row">
<div class="col">
<br>
<input type="submit" class="btn btn-primary" value="Grabar">
<a href="index.php" class="btn btn-info">Salir</a>
</div>
</div>
</form>
</div>
<br>
<footer class="bg-dark text-white">
<div class="row">
<div class="col-md-12 text-center">
<p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-
DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri
pt>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity
="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri
pt>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri
ty="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri
pt>
</body>
</html>
DELETE
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "barespel";
$conn = new mysqli($servername, $username, $password, $dbname);
if (isset($_POST["btn_eliminar"])) {
$men_id=$_POST["men_id"];
$sql = "DELETE FROM menu WHERE men_id=".$men_id;
$result = $conn->query($sql);
if ($result==TRUE) {
$mensaje="";
}else {
$mensaje="No se pudo eliminar el Registro";
}
$conn->close();
header("location:index.php?mensaje=".$mensaje);
}
$men_id= $_GET["men_id"];
// Create connection
$sql = "SELECT bar_nombre,men_id,men_nombre,men_disponible,men_precio,men_descripcion FROM b
ar b,menu m WHERE men_id=".$men_id." AND b.bar_id=m.bar_id ";//* es para seleccionar todos los d
atos de la tabla bar
$result = $conn->query($sql);
$row = $result-
>fetch_assoc();//fetch assoc es para extraer un resultado y ponerlo en una row
$conn->close();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ver Bar</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra
p.min.css" integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<!-- Logo y contacto-->
<header class="nav nav-pills nav-fill" style="background-
color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" >
<li class="nav-item" style="text-align: left;">
<h1>GESTION DE BAR ESPE-L</h1>
<p class="sub">Gestione locales, menus, sugerencias y preferencias</p>
</li>
<li class="nav-item" style="text-align: right; padding-top: 23px">
<a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a>
</li>
</header>
<div class="container" >
<div class="row">
<div class="col">
<br>
<h1 class="text-center">ELIMINAR MENU</h1>
</div>
</div>
<div class="row border">
<div class="col">
<div class="form-group">
<label for="cam_id" class="font-weight-bold">Bar</label>
<br>
<span id="bar_id"><?php echo $row["bar_nombre"];?></span>
</div>
<div class="form-group">
<label for="men_nombre" class="font-weight-bold">Nombre del plato</label>
<br>
<span id="men_nombre"><?php echo $row["men_nombre"];?></span>
</div>
<div class="form-group">
<label for="men_precio" class="font-weight-bold">Precio</label>
<br>
<span id="men_precio"><?php echo $row["men_precio"];?></span>
</div>
<div class="form-group">
<label for="men_disponible" class="font-weight-bold">Estado</label>
<br>
<span id="men_disponible">
<?php if($row["men_disponible"]==1)
echo "Disponible";
else echo "No disponible";?>
</span>
</div>
<div class="form-group">
<label for="men_descripcion" class="font-weight-bold">Descripcion</label>
<br>
<span id="men_descripcion"><?php echo $row["men_descripcion"];?></span>
</div>
</div>
</div>
<div class="row">
<div class="col">
<br>
<form action="" method="POST">
<input type="hidden" name="men_id" value=<?php echo $row["men_id"]?>>
<input type="submit" class="btn btn-
danger" value="Eliminar" name="btn_eliminar">
<a href="index.php" class="btn btn-info">Salir</a>
</form>
</div>
</div>
</div>
<br>
<footer class="bg-dark text-white">
<div class="row">
<div class="col-md-12 text-center">
<p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-
DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri
pt>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity
="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri
pt>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri
ty="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri
pt>
</body>
</html>
INDEX
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "barespel";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
$sql = "SELECT bar_nombre,men_id,men_nombre,men_precio,men_disponible,men_descripcion FROM b
ar b,menu m WHERE b.bar_id=m.bar_id ";//* es para seleccionar todos los datos de la tabla bar
$result = $conn->query($sql);
$conn->close();
//validacion para ver si existia el mensaje
if (isset($_GET["mensaje"])) {
$mensaje=$_GET["mensaje"];
}else {
$mensaje="";
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gestión de Menu</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra
p.min.css" integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<!-- Logo y contacto-->
<header class="nav nav-pills nav-fill" style="background-
color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" >
<li class="nav-item" style="text-align: left;">
<h1>GESTION DE BAR ESPE-L</h1>
<p class="sub">Gestione locales, menus, sugerencias y preferencias</p>
</li>
<li class="nav-item" style="text-align: right; padding-top: 23px">
<a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a>
</li>
</header>
<div class="container">
<div class="row">
<div class="col">
<br>
<h1 class ="text-center" >GESTIÓN DE MENU</h1>
</div>
</div>
<!-- Espacio para mensajes-->
<div class="row">
<div class="col">
<p class ="text-danger" ><?php echo $mensaje ?></p>
</div>
</div>
<!-- Fin espacio para mensajes-->
<div class="row">
<div class="col">
<div class="row">
<div class="col-sm text-left" >
<a href="create.php" class="btn btn-success">Nuevo</a>
</div>
<div class="col-sm text-right" >
<a href="../index.php" class="btn btn-warning">Regresar al Inicio</a>
</div>
</div>
<br>
<table class="table table-responsive-sm">
<tr class="thead-dark">
<th class ="text-center">Ord</th>
<th>Bar</th>
<th>Nombre</th>
<th class ="text-center">Precio</th>
<th>Estado</th>
<th>Descripcion</th>
<th class ="text-center">Operciones</th>
</tr>
<?php
$ord=1;
while($row = $result->fetch_assoc()) {
?>
<tr>
<td class ="text-center"><?php echo $ord++;?></td>
<td><?php echo $row["bar_nombre"]?></td>
<td><?php echo $row["men_nombre"]?></td>
<td class ="text-center"><?php echo $row["men_precio"]?></td>
<td>
<?php if($row["men_disponible"]==1)
echo "Disponible";
else echo "No disponible";?>
</td>
<td><?php echo $row["men_descripcion"]?></td>
<td class ="text-center">
<a href="view.php?men_id=<?php echo $row["men_id"]?>" class="btn btn
-info">Ver</a>
<a href="update.php?men_id=<?php echo $row["men_id"]?>" class="btn b
tn-primary">Editar</a>
<a href="delete.php?men_id=<?php echo $row["men_id"]?>" class="btn b
tn-danger">Eliminar</a>
</td>
</tr>
<?php
}
?>
</table>
</div>
</div>
</div>
<br>
<footer class="bg-dark text-white">
<div class="row">
<div class="col-md-12 text-center">
<p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-
DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri
pt>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity
="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri
pt>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri
ty="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri
pt>
</body>
</html>
UPDATE
<?php
//conexion a la base de datos
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "barespel";
$conn = new mysqli($servername, $username, $password, $dbname);
if (isset($_POST["men_nombre"])) {
$men_id=$_POST["men_id"];
$bar_id=$_POST["bar_id"];
$men_nombre=strtoupper($_POST["men_nombre"]);
$men_precio=$_POST["men_precio"];
$men_disponible=$_POST["men_disponible"];
$men_descripcion=$_POST["men_descripcion"];
// Create connection
$sql = "UPDATE menu SET bar_id=".$bar_id.",men_nombre='".$men_nombre."',men_descripcion=
'".$men_descripcion."',men_precio=".$men_precio.",men_disponible=".$men_disponible." WHERE men_i
d=".$men_id;
ECHO $sql;
$conn->query($sql);
$conn->close();
header("Location: index.php");
}
$men_id=$_GET["men_id"];
$sql = "SELECT bar_nombre,b.bar_id,men_id,men_nombre,men_precio,men_disponible,men_descripci
on FROM menu b,bar c WHERE men_id=".$men_id." AND b.bar_id=c.bar_id ";//* es para seleccionar to
dos los datos de la tabla bar
$result = $conn->query($sql);
$row = $result->fetch_assoc();
if ($row["men_disponible"]==1) {
$abierto="checked";
$cerrado="";
}else{
$abierto="";
$cerrado="checked";
}
$sql = "SELECT * FROM bar ORDER BY bar_nombre";//* es para seleccionar todos los datos de la
tabla bar
$result_bar = $conn->query($sql);
$conn->close();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Crear Menu</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra
p.min.css" integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<!-- Logo y contacto-->
<header class="nav nav-pills nav-fill" style="background-
color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" >
<li class="nav-item" style="text-align: left;">
<h1>GESTION DE BAR ESPE-L</h1>
<p class="sub">Gestione locales, menus, sugerencias y preferencias</p>
</li>
<li class="nav-item" style="text-align: right; padding-top: 23px">
<a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a>
</li>
</header>
<div class="container" >
<div class="row">
<div class="col">
<br>
<h1 class ="text-center">ACTUALIZAR MENU</h1>
</div>
</div>
<form action=""method="POST">
<div class="row border">
<div class="col">
<div class="form-group">
<label for="bar_id">Bar</label>
<select class="custom-select"id="bar_id" name="bar_id">
<?php while($row_bar=$result_bar-> fetch_assoc()){ ?>
<option value="<?php echo $row_bar["bar_id"]?>"<?php if ($row["bar_i
d"]==$row_bar["bar_id"]) {
echo "selected";
}?>>
<?php echo $row_bar["bar_nombre"]?></option>
<?php } ?>
</select>
</div>
<div class="form-group">
<label for="men_nombre">Nombre</label>
<input type="text" class="form-
control" id="men_nombre" name="men_nombre" value="<?php echo $row["men_nombre"]?>" >
</div>
<div class="form-group">
<label for="men_nombre">Precio</label>
<input type="text" class="form-
control" id="men_precio" name="men_precio" value="<?php echo $row["men_precio"]?>">
</div>
<div class="form-group">
<label for="men_disponible">Disponible</label>
<input type="radio" class="form-
control" id="men_disponible" name="men_disponible" value="1" <?php echo $abierto?>>
<label for="sna_disponible">No Disponible</label>
<input type="radio" class="form-
control" id="men_disponible" name="men_disponible" value="0" <?php echo $cerrado?>>
</div>
<div class="form-group">
<label for="men_descripcion">Descripcion</label>
<input type="text" class="form-
control" id="men_descripcion" name="men_descripcion" value="<?php echo $row["men_descripcion"]?>
">
</div>
</div>
</div>
<div class="row">
<div class="col">
<br>
<input type="hidden" name="men_id" value=<?php echo $row["men_id"]?>>
<input type="submit" class="btn btn-primary" value="Grabar">
<a href="index.php" class="btn btn-info">Salir</a>
</div>
</div>
</form>
</div>
<br>
<footer class="bg-dark text-white">
<div class="row">
<div class="col-md-12 text-center">
<p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-
DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri
pt>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity
="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri
pt>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri
ty="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri
pt>
</body>
</html>
VIEW
<?php
$men_id= $_GET["men_id"];
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "barespel";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
$sql = "SELECT bar_nombre,men_id,men_nombre,men_disponible,men_precio,men_descripcion FROM b
ar b,menu m WHERE men_id=".$men_id." AND b.bar_id=m.bar_id ";//* es para seleccionar todos los d
atos de la tabla bar
$result = $conn->query($sql);
$row = $result-
>fetch_assoc();//fetch assoc es para extraer un resultado y ponerlo en una row
$conn->close();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ver Bar</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra
p.min.css" integrity="sha384-
9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
</head>
<body>
<!-- Logo y contacto-->
<header class="nav nav-pills nav-fill" style="background-
color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" >
<li class="nav-item" style="text-align: left;">
<h1>GESTION DE BAR ESPE-L</h1>
<p class="sub">Gestione locales, menus, sugerencias y preferencias</p>
</li>
<li class="nav-item" style="text-align: right; padding-top: 23px">
<a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a>
</li>
</header>
<div class="container" >
<div class="row">
<div class="col">
<br>
<h1 class="text-center">VER MENU</h1>
</div>
</div>
<div class="row border">
<div class="col">
<div class="form-group">
<label for="cam_id" class="font-weight-bold">Locales</label>
<br>
<span id="bar_id"><?php echo $row["bar_nombre"];?></span>
</div>
<div class="form-group">
<label for="men_nombre" class="font-weight-bold">Nombre del plato</label>
<br>
<span id="men_nombre"><?php echo $row["men_nombre"];?></span>
</div>
<div class="form-group">
<label for="men_precio" class="font-weight-bold">Precio</label>
<br>
<span id="men_precio"><?php echo $row["men_precio"];?></span>
</div>
<div class="form-group">
<label for="men_disponible" class="font-weight-bold">Estado</label>
<br>
<span id="men_disponible">
<?php if($row["men_disponible"]==1)
echo "Disponible";
else echo "No disponible";?>
</span>
</div>
<div class="form-group">
<label for=men_descripcion" class="font-weight-bold">Descripcion</label>
<br>
<span id="men_descripcion"><?php echo $row["men_descripcion"];?></span>
</div>
</div>
</div>
<div class="row">
<div class="col">
<br>
<a href="index.php" class="btn btn-info">Salir</a>
</div>
</div>
</div>
<br>
<footer class="bg-dark text-white">
<div class="row">
<div class="col-md-12 text-center">
<p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-
DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri
pt>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity
="sha384-
Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri
pt>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri
ty="sha384-
OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri
pt>
</body>
</html>
 Captura de la página principal
 Captura de las opciones Index de cada una de los CRUD
1. index bar
2. index menú
3. index snack
4. index buzon

Programación Nativa de un CRUD

  • 1.
    TALLER 1_U2 12 deJulio del 2020 Programación Web Nombre: Edison Paul Paca Morocho
  • 2.
     Diagrama deNavegación  Moqups de diseño de Pantalla  Código Fuente del CRUD de la tabla Menú CREATE <?php //conexion a la base de datos $servername = "localhost"; $username = "root"; $password = ""; $dbname = "barespel";
  • 3.
    $conn = newmysqli($servername, $username, $password, $dbname); if (isset($_POST["men_nombre"])) { $bar_id=$_POST["bar_id"]; $men_nombre=strtoupper($_POST["men_nombre"]); $men_precio=$_POST["men_precio"]; $men_disponible=$_POST["men_disponible"]; $men_descripcion=$_POST["men_descripcion"]; // Create connection $sql = "INSERT INTO menu (men_id,bar_id,men_nombre,men_precio,men_disponible,men_descrip cion) VALUES(0,".$bar_id.",'".$men_nombre."',".$men_precio.",".$men_disponible.",'".$men_descrip cion."')";//* es para seleccionar todos los datos de la tabla bar ECHO $sql; $conn->query($sql); $conn->close(); header("Location: index.php"); } $sql = "SELECT * FROM bar ORDER BY bar_nombre";//* es para seleccionar todos los datos de la tabla bar $result_bar = $conn->query($sql); $conn->close(); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Crear Menu</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra p.min.css" integrity="sha384- 9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <!-- Logo y contacto--> <header class="nav nav-pills nav-fill" style="background- color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" > <li class="nav-item" style="text-align: left;"> <h1>GESTION DE BAR ESPE-L</h1> <p class="sub">Gestione locales, menus, sugerencias y preferencias</p> </li> <li class="nav-item" style="text-align: right; padding-top: 23px"> <a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a> </li> </header> <div class="container" > <div class="row"> <div class="col"> <br> <h1 class ="text-center">CREAR MENU</h1> </div>
  • 4.
    </div> <form action="create.php"method="POST"> <div class="rowborder"> <div class="col"> <div class="form-group"> <label for="bar_id">Locales</label> <select class="custom-select"id="bar_id" name="bar_id"> <?php while($row=$result_bar-> fetch_assoc()){ ?> <option value="<?php echo $row["bar_id"]?>"><?php echo $row["bar_nom bre"]?></option> <?php } ?> </select> </div> <div class="form-group"> <label for="men_nombre">Nombre</label> <input type="text" class="form- control" id="men_nombre" name="men_nombre" required> </div> <div class="form-group"> <label for="men_nombre">Precio</label> <input type="text" class="form- control" id="men_precio" name="men_precio" required> </div> <div class="form-group"> <label for="men_disponible">Disponible</label> <input type="radio" class="form- control" id="men_disponible" name="men_disponible" value="1"> <label for="sna_disponible">Agotado</label> <input type="radio" class="form- control" id="men_disponible" name="men_disponible" value="0"> </div> <div class="form-group"> <label for="men_descripcion">Descripcion</label> <input type="text" class="form- control" id="men_descripcion" name="men_descripcion"> </div> </div> </div> <div class="row"> <div class="col"> <br> <input type="submit" class="btn btn-primary" value="Grabar"> <a href="index.php" class="btn btn-info">Salir</a> </div> </div> </form> </div> <br> <footer class="bg-dark text-white">
  • 5.
    <div class="row"> <div class="col-md-12text-center"> <p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p> </div> </div> </footer> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384- DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri pt> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity ="sha384- Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri pt> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri ty="sha384- OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri pt> </body> </html> DELETE <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "barespel"; $conn = new mysqli($servername, $username, $password, $dbname); if (isset($_POST["btn_eliminar"])) { $men_id=$_POST["men_id"]; $sql = "DELETE FROM menu WHERE men_id=".$men_id; $result = $conn->query($sql); if ($result==TRUE) { $mensaje=""; }else { $mensaje="No se pudo eliminar el Registro"; } $conn->close(); header("location:index.php?mensaje=".$mensaje); } $men_id= $_GET["men_id"]; // Create connection $sql = "SELECT bar_nombre,men_id,men_nombre,men_disponible,men_precio,men_descripcion FROM b ar b,menu m WHERE men_id=".$men_id." AND b.bar_id=m.bar_id ";//* es para seleccionar todos los d atos de la tabla bar $result = $conn->query($sql);
  • 6.
    $row = $result- >fetch_assoc();//fetchassoc es para extraer un resultado y ponerlo en una row $conn->close(); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Ver Bar</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra p.min.css" integrity="sha384- 9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <!-- Logo y contacto--> <header class="nav nav-pills nav-fill" style="background- color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" > <li class="nav-item" style="text-align: left;"> <h1>GESTION DE BAR ESPE-L</h1> <p class="sub">Gestione locales, menus, sugerencias y preferencias</p> </li> <li class="nav-item" style="text-align: right; padding-top: 23px"> <a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a> </li> </header> <div class="container" > <div class="row"> <div class="col"> <br> <h1 class="text-center">ELIMINAR MENU</h1> </div> </div> <div class="row border"> <div class="col"> <div class="form-group"> <label for="cam_id" class="font-weight-bold">Bar</label> <br> <span id="bar_id"><?php echo $row["bar_nombre"];?></span> </div> <div class="form-group"> <label for="men_nombre" class="font-weight-bold">Nombre del plato</label> <br> <span id="men_nombre"><?php echo $row["men_nombre"];?></span> </div> <div class="form-group"> <label for="men_precio" class="font-weight-bold">Precio</label>
  • 7.
    <br> <span id="men_precio"><?php echo$row["men_precio"];?></span> </div> <div class="form-group"> <label for="men_disponible" class="font-weight-bold">Estado</label> <br> <span id="men_disponible"> <?php if($row["men_disponible"]==1) echo "Disponible"; else echo "No disponible";?> </span> </div> <div class="form-group"> <label for="men_descripcion" class="font-weight-bold">Descripcion</label> <br> <span id="men_descripcion"><?php echo $row["men_descripcion"];?></span> </div> </div> </div> <div class="row"> <div class="col"> <br> <form action="" method="POST"> <input type="hidden" name="men_id" value=<?php echo $row["men_id"]?>> <input type="submit" class="btn btn- danger" value="Eliminar" name="btn_eliminar"> <a href="index.php" class="btn btn-info">Salir</a> </form> </div> </div> </div> <br> <footer class="bg-dark text-white"> <div class="row"> <div class="col-md-12 text-center"> <p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p> </div> </div> </footer> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384- DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri pt> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity ="sha384- Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri pt>
  • 8.
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri ty="sha384- OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"crossorigin="anonymous"></scri pt> </body> </html> INDEX <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "barespel"; // Create connection $conn = new mysqli($servername, $username, $password, $dbname); $sql = "SELECT bar_nombre,men_id,men_nombre,men_precio,men_disponible,men_descripcion FROM b ar b,menu m WHERE b.bar_id=m.bar_id ";//* es para seleccionar todos los datos de la tabla bar $result = $conn->query($sql); $conn->close(); //validacion para ver si existia el mensaje if (isset($_GET["mensaje"])) { $mensaje=$_GET["mensaje"]; }else { $mensaje=""; } ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Gestión de Menu</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra p.min.css" integrity="sha384- 9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <!-- Logo y contacto--> <header class="nav nav-pills nav-fill" style="background- color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" > <li class="nav-item" style="text-align: left;"> <h1>GESTION DE BAR ESPE-L</h1> <p class="sub">Gestione locales, menus, sugerencias y preferencias</p> </li> <li class="nav-item" style="text-align: right; padding-top: 23px"> <a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a> </li>
  • 9.
    </header> <div class="container"> <div class="row"> <divclass="col"> <br> <h1 class ="text-center" >GESTIÓN DE MENU</h1> </div> </div> <!-- Espacio para mensajes--> <div class="row"> <div class="col"> <p class ="text-danger" ><?php echo $mensaje ?></p> </div> </div> <!-- Fin espacio para mensajes--> <div class="row"> <div class="col"> <div class="row"> <div class="col-sm text-left" > <a href="create.php" class="btn btn-success">Nuevo</a> </div> <div class="col-sm text-right" > <a href="../index.php" class="btn btn-warning">Regresar al Inicio</a> </div> </div> <br> <table class="table table-responsive-sm"> <tr class="thead-dark"> <th class ="text-center">Ord</th> <th>Bar</th> <th>Nombre</th> <th class ="text-center">Precio</th> <th>Estado</th> <th>Descripcion</th> <th class ="text-center">Operciones</th> </tr> <?php $ord=1; while($row = $result->fetch_assoc()) { ?> <tr> <td class ="text-center"><?php echo $ord++;?></td> <td><?php echo $row["bar_nombre"]?></td> <td><?php echo $row["men_nombre"]?></td> <td class ="text-center"><?php echo $row["men_precio"]?></td> <td> <?php if($row["men_disponible"]==1) echo "Disponible";
  • 10.
    else echo "Nodisponible";?> </td> <td><?php echo $row["men_descripcion"]?></td> <td class ="text-center"> <a href="view.php?men_id=<?php echo $row["men_id"]?>" class="btn btn -info">Ver</a> <a href="update.php?men_id=<?php echo $row["men_id"]?>" class="btn b tn-primary">Editar</a> <a href="delete.php?men_id=<?php echo $row["men_id"]?>" class="btn b tn-danger">Eliminar</a> </td> </tr> <?php } ?> </table> </div> </div> </div> <br> <footer class="bg-dark text-white"> <div class="row"> <div class="col-md-12 text-center"> <p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p> </div> </div> </footer> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384- DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri pt> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity ="sha384- Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri pt> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri ty="sha384- OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri pt> </body> </html> UPDATE <?php //conexion a la base de datos $servername = "localhost"; $username = "root"; $password = "";
  • 11.
    $dbname = "barespel"; $conn= new mysqli($servername, $username, $password, $dbname); if (isset($_POST["men_nombre"])) { $men_id=$_POST["men_id"]; $bar_id=$_POST["bar_id"]; $men_nombre=strtoupper($_POST["men_nombre"]); $men_precio=$_POST["men_precio"]; $men_disponible=$_POST["men_disponible"]; $men_descripcion=$_POST["men_descripcion"]; // Create connection $sql = "UPDATE menu SET bar_id=".$bar_id.",men_nombre='".$men_nombre."',men_descripcion= '".$men_descripcion."',men_precio=".$men_precio.",men_disponible=".$men_disponible." WHERE men_i d=".$men_id; ECHO $sql; $conn->query($sql); $conn->close(); header("Location: index.php"); } $men_id=$_GET["men_id"]; $sql = "SELECT bar_nombre,b.bar_id,men_id,men_nombre,men_precio,men_disponible,men_descripci on FROM menu b,bar c WHERE men_id=".$men_id." AND b.bar_id=c.bar_id ";//* es para seleccionar to dos los datos de la tabla bar $result = $conn->query($sql); $row = $result->fetch_assoc(); if ($row["men_disponible"]==1) { $abierto="checked"; $cerrado=""; }else{ $abierto=""; $cerrado="checked"; } $sql = "SELECT * FROM bar ORDER BY bar_nombre";//* es para seleccionar todos los datos de la tabla bar $result_bar = $conn->query($sql); $conn->close(); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Crear Menu</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra p.min.css" integrity="sha384- 9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <!-- Logo y contacto-->
  • 12.
    <header class="nav nav-pillsnav-fill" style="background- color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" > <li class="nav-item" style="text-align: left;"> <h1>GESTION DE BAR ESPE-L</h1> <p class="sub">Gestione locales, menus, sugerencias y preferencias</p> </li> <li class="nav-item" style="text-align: right; padding-top: 23px"> <a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a> </li> </header> <div class="container" > <div class="row"> <div class="col"> <br> <h1 class ="text-center">ACTUALIZAR MENU</h1> </div> </div> <form action=""method="POST"> <div class="row border"> <div class="col"> <div class="form-group"> <label for="bar_id">Bar</label> <select class="custom-select"id="bar_id" name="bar_id"> <?php while($row_bar=$result_bar-> fetch_assoc()){ ?> <option value="<?php echo $row_bar["bar_id"]?>"<?php if ($row["bar_i d"]==$row_bar["bar_id"]) { echo "selected"; }?>> <?php echo $row_bar["bar_nombre"]?></option> <?php } ?> </select> </div> <div class="form-group"> <label for="men_nombre">Nombre</label> <input type="text" class="form- control" id="men_nombre" name="men_nombre" value="<?php echo $row["men_nombre"]?>" > </div> <div class="form-group"> <label for="men_nombre">Precio</label> <input type="text" class="form- control" id="men_precio" name="men_precio" value="<?php echo $row["men_precio"]?>"> </div> <div class="form-group"> <label for="men_disponible">Disponible</label> <input type="radio" class="form- control" id="men_disponible" name="men_disponible" value="1" <?php echo $abierto?>> <label for="sna_disponible">No Disponible</label> <input type="radio" class="form- control" id="men_disponible" name="men_disponible" value="0" <?php echo $cerrado?>>
  • 13.
    </div> <div class="form-group"> <label for="men_descripcion">Descripcion</label> <inputtype="text" class="form- control" id="men_descripcion" name="men_descripcion" value="<?php echo $row["men_descripcion"]?> "> </div> </div> </div> <div class="row"> <div class="col"> <br> <input type="hidden" name="men_id" value=<?php echo $row["men_id"]?>> <input type="submit" class="btn btn-primary" value="Grabar"> <a href="index.php" class="btn btn-info">Salir</a> </div> </div> </form> </div> <br> <footer class="bg-dark text-white"> <div class="row"> <div class="col-md-12 text-center"> <p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p> </div> </div> </footer> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384- DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri pt> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity ="sha384- Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri pt> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integri ty="sha384- OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri pt> </body> </html> VIEW <?php $men_id= $_GET["men_id"]; $servername = "localhost"; $username = "root"; $password = ""; $dbname = "barespel";
  • 14.
    // Create connection $conn= new mysqli($servername, $username, $password, $dbname); $sql = "SELECT bar_nombre,men_id,men_nombre,men_disponible,men_precio,men_descripcion FROM b ar b,menu m WHERE men_id=".$men_id." AND b.bar_id=m.bar_id ";//* es para seleccionar todos los d atos de la tabla bar $result = $conn->query($sql); $row = $result- >fetch_assoc();//fetch assoc es para extraer un resultado y ponerlo en una row $conn->close(); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Ver Bar</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstra p.min.css" integrity="sha384- 9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> </head> <body> <!-- Logo y contacto--> <header class="nav nav-pills nav-fill" style="background- color: #02011c; color: white; margin: 0px; width: all; padding-left: 23px;padding-right: 23px" > <li class="nav-item" style="text-align: left;"> <h1>GESTION DE BAR ESPE-L</h1> <p class="sub">Gestione locales, menus, sugerencias y preferencias</p> </li> <li class="nav-item" style="text-align: right; padding-top: 23px"> <a href="contact.php" class="btn btn-success btn-lg ">CONTACTOS</a> </li> </header> <div class="container" > <div class="row"> <div class="col"> <br> <h1 class="text-center">VER MENU</h1> </div> </div> <div class="row border"> <div class="col"> <div class="form-group"> <label for="cam_id" class="font-weight-bold">Locales</label> <br> <span id="bar_id"><?php echo $row["bar_nombre"];?></span> </div>
  • 15.
    <div class="form-group"> <label for="men_nombre"class="font-weight-bold">Nombre del plato</label> <br> <span id="men_nombre"><?php echo $row["men_nombre"];?></span> </div> <div class="form-group"> <label for="men_precio" class="font-weight-bold">Precio</label> <br> <span id="men_precio"><?php echo $row["men_precio"];?></span> </div> <div class="form-group"> <label for="men_disponible" class="font-weight-bold">Estado</label> <br> <span id="men_disponible"> <?php if($row["men_disponible"]==1) echo "Disponible"; else echo "No disponible";?> </span> </div> <div class="form-group"> <label for=men_descripcion" class="font-weight-bold">Descripcion</label> <br> <span id="men_descripcion"><?php echo $row["men_descripcion"];?></span> </div> </div> </div> <div class="row"> <div class="col"> <br> <a href="index.php" class="btn btn-info">Salir</a> </div> </div> </div> <br> <footer class="bg-dark text-white"> <div class="row"> <div class="col-md-12 text-center"> <p><br><span>© Copyright ©2020 All rights reserved by Edison Paca</span></p> </div> </div> </footer> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384- DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></scri pt> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity ="sha384-
  • 16.
    Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></scri pt> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"integri ty="sha384- OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></scri pt> </body> </html>  Captura de la página principal  Captura de las opciones Index de cada una de los CRUD 1. index bar 2. index menú
  • 17.
    3. index snack 4.index buzon