Differences

This shows you the differences between two versions of the page.

--- es:web_development:forms:inputs [2022/07/05 07:21]
mag [Número]
+++ es:web_development:forms:inputs [2023/08/16 09:33] (current)
@@ Line 162: / Line 162: @@
     $rslt  = $pdo->prepare($query);
     $rslt->execute($args);</code>
   * Ahora podemos recorrer la respuesta y agregar una opción para cada una.
@@ Line 179: / Line 179: @@
                     </li></code>
+  * Subir el código y refrescar la página para comprobar que se muestra como queremos.
+==== Casillas de Verificación ====
+  * El segundo elemento de la lista en este formulario serán las películas.
+  * También necesitaremos obtener esta lista de la base de datos.
+  * Agregue el siguiente código debajo de la consulta de héroe
+<code>    // obtener la lista de películas
+    $query = "SELECT * FROM appearances";
+    $args  = array();
+    $mrslt = $pdo->prepare($query);
+    $mrslt->execute($args);</code>
+  * Ahora muestre cada película debajo de la etiqueta 'Película'.
+<code><?php
+    // mostrar lista de peliculas
+    while($row = $mrslt->fetch()) {
+?>
+                            <li></li>
+<?php
+    }
+?></code>
+  * Debe reconocer la mayor parte de este código, ya que es el mismo que el código anterior con algunas modificaciones. <html>$hrslt</html> ahora es <html>$mrslt</html> porque estamos mirando el resultado de la consulta de la película en lugar del resultado de la consulta del héroe.
+  * Ahora, agreguemos la casilla de verificación
+<code>                            <li><input type="checkbox" name="movie[]" value="<?php echo $row['movie']; ?>" id=""> <?php echo $row['movie']; ?></li></code>
+  * Tenga en cuenta que la entrada de la casilla de verificación es muy similar a una entrada de radio. Tiene un nombre y un valor y un texto para mostrar.
+  * El nombre es ligeramente diferente. El nombre 'película' se agrega <html>[]</html> porque queremos enviar una lista de apariencias como una matriz.
+  * Cargue el código guardado y actualice la página.
+  * Debería ver una lista de películas con una casilla de verificación al frente.
+  * Desafortunadamente, 'Los Vengadores' aparece 5 veces.
+==== GROUP BY ====
+  * Para solucionar esto, echemos un vistazo directamente a la base de datos.
+  * Abra PHPMyAdmin y seleccione la tabla 'apariencias'.
+  * La lista de películas aparece tal como lo hizo en nuestra página, lo que dice que nuestra consulta funcionó correctamente.
+  * Nuestro problema es que realmente solo queremos ver cada película una vez.
+  * Podemos hacerlo usando 'GROUP BY' en nuestra consulta.
+  * Haga clic en la pestaña 'SQL' e ingrese la siguiente consulta.
+<code>SELECT * FROM `appearances` GROUP BY movie</code>
+  * Obtendrá un error que indica que hay una 'columna no agregada' en nuestro resultado. Esto significa que algunos de los otros datos (en este caso, tanto id como character_name pueden tener datos diferentes para el mismo valor de película y MySQL no sabe qué mostrar.
+  * Mira las líneas 4 y 5 para ver esto. Cuando agrupamos a todos los héroes que aparecen en 'Los Vengadores', MySQL quiere comprimir el id (4 y 5) y el character_name (Capitán América y Hulk) en la misma fila, pero no puede.
+  * Hay algunos trucos que podemos hacer con números (como probar el total) e incluso podríamos obtener solo la primera entrada, pero por ahora solo queremos el nombre de la película, así que especifíquelo en la consulta.
+<code>SELECT movie FROM `appearances` GROUP BY movie</code>
+  * Ejecute esta consulta y verá que obtenemos una lista de películas, cada una de las cuales aparece solo una vez. Perfecto.
+  * Ahora coloquemos esto en nuestra consulta en 'form.php'.
+<code>    // get list of movies
+    $query = "SELECT movie FROM appearances GROUP BY movie";
+    $args  = array();
+    $mrslt = $pdo->prepare($query);
+    $mrslt->execute($args);</code>
+  * Actualiza la página y comprueba que cada película solo aparece una vez.
+==== Agregar Película ====
+  * ¿Qué hará nuestro usuario cuando quiera agregar una apariencia para una película que aún no está en la lista?
+  * Por ejemplo, Scarlet Witch aparece como una heroína, pero no aparece en ninguna de las películas de la lista.
+  * Necesitamos una línea donde el usuario pueda agregar otra película.
+  * Agregue este código después del ciclo (pero antes de la etiqueta <html><ul></html>).
+<code>                            <li><input type="checkbox" name="movie[]" value="new" id=""> <input type="text" name="new_movie"></li></code>
+==== Parámetros Múltiples ====
+  * Finalmente, necesitamos nuestro botón de envío antes de la etiqueta de cierre <html></form></html>.
+<code>                <input type="submit" name="submit" value="Add Appearance"></code>
+  * Actualice la página, ingrese algunos datos y haga clic en enviar.
+  * Mire la URL con todos nuestros datos en ella.
+  * Tenga en cuenta que en lugar de usar comas para separar cada par de nombre/valor, los pares están separados por <html>&</html>.
+  * Observe también que cuando envía un campo con dos palabras, el espacio se reemplaza por un <html>+</html> símbolo. Es por eso que comenzamos con solo 'Hulk' y 'Thor' en la primera actividad.
+  * Ahora que tenemos todo funcionando, creo que podemos mejorar un poco el estilo.
+==== Codigo Final ====
+  * [[https://techschool.murraygunn.id.au/webdev/classes/forms/2/form.es.php|form.php]]
+  * [[https://techschool.murraygunn.id.au/webdev/classes/forms/2/database.es.php|database.php]]
+  * [[https://techschool.murraygunn.id.au/webdev/classes/forms/2/form.php|resultado]]
+[[es:web_development:forms:styling|Siguiente: Estilismo]]

Tech School

User Tools

Site Tools

Differences

Page Tools