Ejercicios MVC en Java

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

Ejercicio – Lista de invitados

Hacer una página web para una lista de invitados con 4 secciones. Una para consultar los invitados, otra para dar de alta un nuevo invitado y otra para darlo de baja.La tabla que usaremos tendrá dos campos: nombre (VARCHAR) e ID (INT, AUTOINCREMENT, PK).

Las operaciones de modificación en la base de datos se harán en una clase llamada Servicio.

Cada uno de los siguientes pantallazos representa una página jsp diferente.

La siguiente etiqueta nos permite enviar información en un formulario sin que dicha información aparezca en la vista.

<input type="hidden" name="action" value="alta"/>

Ejercicio fútbol

La segunda carga una collection de beans de Equipo, y la tercera carga una collection de beans de Jugador en función de un parámetro (EQUIPO_COD) que fue procesado en el controlador.

Pantallazo ejercicio resuelto

Trabajo con fechas

Paso de String a Date:
SimpleDateFormat s = new SimpleDateFormat("dd-MM-yyyy");
Date fecha = s.parse("10-12-1982");
Paso de Date a String:
SimpleDateFormat s = new SimpleDateFormat("dd-MM-yyyy"); 
String fechaAlta = s.format(fecha); //fecha es un objeto de tipo Date
Paso de Date a GregorianCalendar:
GregorianCalendar gc = new GregorianCalendar();
gc.setTime(fecha); //fecha es un objeto de tipo Date
String dia = gc.get(GregorianCalendar.DAY_OF_MONTH);
String mes = gc.get(GregorianCalendar.MONTH)+1;
String anio = gc.get(GregorianCalendar.YEAR);
Construcción de un objeto GregorianCalendar
a partir del día, mes y año por separado
new GregorianCalendar(int year, int month, int dayOfMonth

Nota:
Para pasar de String a GregorianCalendar hay que pasar previamente de String a Date.

Descomposición de una fecha en formato String:
String fecha = "24-07-1982";
String [] fechaSplitada = fecha.split("-");
String dia = fechaSplitada[0];
String mes = fechaSplitada[1];
String anio = fechaSplitada[2];
Etiqueta JSTL para formato de fechas
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<fmt:formatDate pattern="dd-MM-yyyy" value="${fecha_java_util_Date}" />

<fmt:formatDate pattern="dd" value="${fecha_java_util_Date}" />

Hospital

Hospital I

La base de datos tendrá 4 campos: id(PRIMARY KEY, AUTOINCREMENT), nombre (VARCHAR), apellidos (VARCHAR), fecha_alta(DATE).

Para convertir una fecha en un objeto de tipo Date:
SimpleDateFormat formatter = new SimpleDateFormat("dd-MM-yyyy");
Date fecha = formatter.parse(stringFecha);

//MM mayúscula, las minúsculas son para minutos.

Estas conversiones las haremos en el controlador (No modificaremos el bean paciente para añadirle las propiedades día, mes y año)

Para modificar la fecha primero convierto el tipo de dato recibido del formulario a un dato de tipo java.util.Date.

Luego, cuando le pase parámetros a la consulta sql convertiré esta fecha un dato de tipo java.sql.Date:

pstmt.setDate(3,new java.sql.Date(fecha.getTime()));
pantallazo ejercicio hospital I

Para que en la página de modificación también podamos eliminar, lo más fácil será tener un segundo formulario, independiente del de modificación, y que ese formulario envie la id del elemento que queremos eliminar como campo oculto (hidden).

Ejercicio listado libros

Este es el código HTML y Javascript que usaremos:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Insert title here</title>
 <style>
  .migrid {
   display: grid;
   grid-template-columns: repeat(5, 150px);
  }
  .migridWrapper{
   display:grid;
   grid-template-columns: 600px 100px;
  }
  button{
   display:block;
   width:100%
  }
 </style>
</head>
<body>
 <c:forEach var="libro" items="${libros}">
  <div class="migridWrapper">
   <form class="migrid" action="/libros-jpa-maven/controlador">
    <div>${libro.id}<input type="hidden" name="idextra" value="${libro.id}" /></div>
    <input type="text" value="${libro.titulo}" name="titulo" />
    <input type="text" value="${libro.precio}" name="precio" />
    <button>Modificar</button><input type="hidden" name="action" value="modificar" />
   </form>
   <form action="/libros-jpa-maven/controlador">
    <button>Borrar</button>
    <input type="hidden" name="idextra" value="${libro.id}" />
    <input type="hidden" name="action" value="baja" />
   </form>
  </div>
 </c:forEach>
 <form class="migrid" action="/libros-jpa-maven/controlador">
  <div></div>
  <input id="action" type="hidden" name="action" value="alta">
  <input type="text" name="titulo" placeholder="Título del libro">
  <input type="text" name="precio" placeholder="Precio del libro">
  <button>Alta</button>
 </form>
</body>
</html>

Paso 1. Hacemos la consulta

Pantallazo ejercicio listado libros 1

Paso 2. Habilitamos el alta

pantallazo listado libros

Paso 3. Habilitamos la baja

Paso 4. Habilitamos la modificación

Pantallazo ejercicio listado libros 4

Ejercicio calidades

Para que las capas amarillas contenidas en la tabla aparezcan alineadas con la parte baja de la misma usaremos el siguiente estilo: <td style=’vertical-align:bottom’>

Como utilizando JSTL y un solo bucle es posible generar la tabla de jugadores de la izquierda y la tabla de calidades de la derecha.

<c:forEach var="jugador" items="${requestScope.jugadores}">
 <tr><td><c:out value="${jugador.numero_camiseta}" /></td><td><c:out value="${jugador.nombre}" /></td></tr>
 <c:set var="fsup">
  ${fsup}<td style="vertical-align:bottom;">
  <div style="background-color:yellow; width:20px; height:${jugador.calidad*30}px"></div></td>  
 </c:set>
 <c:set var="finf">
  ${finf}<td>${jugador.numero_camiseta}</td>
 </c:set> 
</c:forEach>

Al seleccionar un equipo en el desplegable, enviaremos una petición al controlador para mostrar la información del equipo. Usaremos un código similar a este:

<form action="/proyectofutbol/Controller">
   <select name="equipo_cod" onChange="this.form.submit()">
      <c:foreach>
         <option value="[codigo equipo]" >[Nombre equipo]</option>
      </c:foreach>
   </select>
   <input type="hidden" name="action" value="consulta_equipo">
</form>

Ejercicio Login

Si el usuario se loguea con éxito, colocamos un bean del usuario logueado en la sesión. Y redirigimos a la página de »usuario logueado’. En caso contrario, redirigimos a la página de»se ha producido un error».

Descargar ejercicio login resuelto
login

Ejercicio Mensajería

ejercicio mensajería
@Entity
public class Usuario {
 @Id
 @GeneratedValue(strategy=GenerationType.IDENTITY)//Para generar números autoincrementados
 private int id;
 private String nombre;
 private String pass;
 //Siempre que tengamos una relación OneToMany, usaremos el mappedBy
 @OneToMany(mappedBy = "remitente")
 private List <Mensaje> mensajesEnviados;
 @OneToMany(mappedBy = "destinatario")
 private List <Mensaje> mensajesRecibidos;
@Entity
public class Mensaje {
 @Id
 @GeneratedValue(strategy=GenerationType.IDENTITY)//Para generar números autoincrementados
 private int id;
 @ManyToOne
 private Usuario remitente;
 @ManyToOne
 private Usuario destinatario;
 private String mensaje;
mensaje
idremitentedestinatariomensaje
111Hola!
212Qué pasa tron!
311Hola Caracola
412Te odio
usuario
idnombrepass
1ppkk
2kkkk
<input type="checkbox" name="arrayDeUsuarios" value="<c:out value="${usuario.id}"/>"/>
String[] arrayDeUsuarios = request.getParameterValues("arrayDeUsuarios");

Ejercicio foro

ejercicio foro
usuario
idnombrepass
1pppp
2kkkk
comentario
id id_usuario id_hilo comentario
1 2 7 es super guay!
2 2 8 En pablomonteserin.com los vendes muy buenos
hilo
idid_usuarionombre_hilotexto_hilo
71Escoger ordenadorDónde comprar uno bueno
81¿Qué opinas de Ubuntu?Dudas sobre Ubuntu
← Proyecto con Maven
Guardar y recuperar información del Context →