G. formulario.html

1
<!DOCTYPE html>
2
<html lang="es">
3
4
<head>
5
6
 <meta charset="UTF-8">
7
 <meta name="viewport" content="width=device-width">
8
9
 <title>Servicio que procesa un formulario con token</title>
10
11
 <script type="module" src="js/lib/manejaErrores.js"></script>
12
13
</head>
14
15
<body>
16
17
 <form id="formulario">
18
19
  <h1>Servicio que procesa un formulario con token</h1>
20
21
  <p><a href="index.html">Cancela</a></p>
22
23
  <!-- Al enviar la forma, se envía el token recibido. -->
24
  <input type="hidden" name="token">
25
26
  <p>
27
   <label>
28
    Saludo:
29
    <input name="saludo">
30
   </label>
31
  </p>
32
33
  <p>
34
   <label>
35
    Nombre:
36
    <input name="nombre">
37
   </label>
38
  </p>
39
40
  <p>
41
   <button type="reset">Restaurar</button>
42
   <button type="submit">Procesa</button>
43
  </p>
44
45
 </form>
46
47
 <script type="module">
48
49
  import { descargaVista } from "./js/lib/descargaVista.js"
50
  import { consume } from "./js/lib/consume.js"
51
  import { enviaFormRecibeJson } from "./js/lib/enviaFormRecibeJson.js"
52
53
  descargaDatos()
54
55
  async function descargaDatos() {
56
57
   // Al cargar, registra este formulario en la sesión y recibe un token.
58
   await descargaVista("php/vista-formulario.php")
59
60
   formulario.addEventListener("submit", procesa)
61
62
   async function procesa(event) {
63
    event.preventDefault()
64
    const resultado =
65
     await consume(enviaFormRecibeJson("php/procesa.php", formulario))
66
    const mensaje = await resultado.json()
67
    alert(mensaje)
68
    location.href = "index.html"
69
   }
70
71
  }
72
73
 </script>
74
75
</body>
76
77
</html>
skip_previous skip_next