Agregue una nueva línea debajo de la etiqueta de apertura . * Escriba 'formulario' y seleccione la opción que aparece. * La etiqueta

tiene un parámetro llamado action. Aquí es donde desea enviar sus datos. * Establecer action en 'process_form.php'.

* Mueva el párrafo existente dentro de las etiquetas

. * Ahora agregue nuestras opciones de héroe como botones 'enviar'.

* Establecer el type en 'enviar' significa que cuando hacemos clic en el botón, se enviará el formulario y los datos. Ambos botones harán esto. * name es el nombre del parámetro a enviar. Los botones de envío a menudo se llamarán 'enviar' y no contendrán datos, pero a veces habrá dos formularios en una página (o enviados a una página) y necesita saber cuál procesar. Lo usamos aquí para diferenciar a los héroes seleccionados. * El value es el texto que aparecerá en el botón. * Guarde y cargue el archivo, luego abra la página. * Haga clic en su héroe elegido y luego verifique los resultados. ¿Ves el nombre de tu héroe? * Esta es una forma rara de usar un botón Enviar, pero es válida. Veamos otras opciones. ==== Entrada de Texto ==== * Creemos un formulario para agregar héroes a nuestra base de datos. * Necesitaremos campos de entrada para el alias del héroe, la identidad (secreta), si es un héroe o un villano, el año en que apareció por primera vez en los cómics de Marvel (o en otro lugar) y cuál es la fuente de su poder. * Podríamos usar una tabla para presentar nuestro formulario con etiquetas a la izquierda y entradas a la derecha, pero eso no responde, es decir, no se adaptará a pantallas más pequeñas. * En su lugar, usaremos una lista, donde cada etiqueta/par de entrada es un elemento de la lista. * Elimine todo lo que esté dentro de la etiqueta y agregue el siguiente código.

* Los campos para el alias y la identidad del héroe pueden ser simples campos de texto.

                    
                        Alias de héroe:
                        
                    
                    
                        Identidad:

* Aquí tenemos una etiqueta para nuestra entrada, usando la etiqueta . * Luego tenemos una entrada, pero en lugar de ser de type="button" o type="submit", se type="text" usa para un campo de texto simple, generalmente de hasta 100 caracteres más o menos. * Le damos un name que informará a 'process_form.php' a qué se refiere el valor. * Hay dos atributos adicionales que no hemos visto antes. size establece el tamaño del cuadro de entrada en 30 caracteres y maxlength limita la longitud de los caracteres que se pueden ingresar. * Finalmente, tenemos la opción de darle al usuario una pista sobre qué tipo de contenido esperamos aquí usando hint. * Guarde y cargue el código para ver cómo se ve en vivo. ==== Botones de Radio ==== * Cuando tenemos una entrada con solo unas pocas opciones configuradas y solo se puede seleccionar una a la vez, usamos botones de radio. * El ejemplo más común de esto es 'masculino' y 'femenino'. * En este caso queremos saber si nuestro héroe es realmente heroico o villano. Agregue el siguiente código para mostrar esto.

* He etiquetado esta distinción héroe/villano como 'lado', pero si se te ocurre un término mejor, siéntete libre de usarlo. * Una vez más, los botones de radio usan la etiqueta y, al igual que los botones, tienen un nombre y un valor. * no value se muestra como está en un botón, porque no hay espacio en un botón de opción. En cambio, el valor es el texto que queremos enviar a 'process_form.php'. * Añadimos el texto antes o después de dependiendo de cómo queramos que aparezca el formulario. * Finalmente, observe el checked atributo en la primera entrada. Esto establece el elemento predeterminado si desea uno. * Guarda y sube para ver cómo se ve. ==== Número ==== * Nuestro próximo campo es el año en que el héroe apareció por primera vez en un cómic (o película, etc.). * Se enviará como texto, pero en realidad es un número y podemos ayudar a nuestro usuario especificándolo. * Agregue el siguiente código a su formulario.

                    
                        Primera aparición:

* También podemos configurar sizey maxlength, pero veremos mejores formas de administrar esto más adelante. * Guarde y cargue el código para ver cómo se ve. Casi exactamente lo mismo que una entrada de texto, ¿verdad? * Tenga en cuenta que tiene flechas hacia arriba y hacia abajo para permitir a los usuarios cambiar el número por incrementos. * Si tiene un dispositivo móvil para cargar la página, también notará que el teclado cambia automáticamente a una entrada numérica en lugar del diseño de teclado habitual. ==== Cuadros Desplegables ==== * Nuestro próximo campo es la fuente del poder del héroe. Este es un tipo de categoría, donde queremos controlar las opciones que se pueden seleccionar. * Para esto usamos un todas se ubican dentro de la etiqueta. * En lugar de configurar namepara cada opción individualmente, lo configuramos una vez en la etiqueta * Guarde y cargue el archivo. * Agregue algunos datos y haga clic en el botón para enviar sus datos. * Tenga en cuenta que si elige 'Biológico' como fuente de poder, el resultado se envía como 'poder=bio' en lugar de 'poder=Biológico' debido a lo value asociado con esa opción. ==== Consulta de Base de Datos ==== * También nos gustaría poder agregar las apariencias de cada héroe. Esto se puede hacer de varias maneras, pero vamos a crear un formulario separado para ello. * Agregue un formulario debajo del existente con la misma acción ('process_form.php'). * Agregue una lista desordenada con dos entradas. * La primera entrada tendrá una etiqueta de 'Héroe' y un cuadro de selección con todos nuestros héroes conocidos. Como queremos que se actualice si agregamos héroes usando el primer formulario, debemos extraer los datos de la base de datos. * Para hacer esto, primero necesitaremos configurar nuestra base de datos. * Agregue la siguiente línea antes de incluir el encabezado. include('database.php'); * Ahora cree un nuevo archivo llamado 'database.php' y llénelo con el código de configuración de la base de datos que usamos en 'mysql.php'.

getMessage(), (int)$e->getCode());
    }
?>

* En algún momento después de eso (prefiero al final del primer bloque de PHP para que todos los includecomandos estén juntos) agregue algo de código para obtener los nombres de los héroes.

    // obtener la lista de héroes
    $query = "SELECT * FROM heroes";
    $args  = array();
    $rslt  = $pdo->prepare($query);
    $rslt->execute($args);

* Ahora podemos recorrer la respuesta y agregar una opción para cada una.

                    
                        Héroe

* 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

    // obtener la lista de películas
    $query = "SELECT * FROM appearances";
    $args  = array();
    $mrslt = $pdo->prepare($query);
    $mrslt->execute($args);

* Ahora muestre cada película debajo de la etiqueta 'Película'.

fetch()) {
?>

* Debe reconocer la mayor parte de este código, ya que es el mismo que el código anterior con algunas modificaciones. $hrslt ahora es $mrslt 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 * 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 [] 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. SELECT * FROM `appearances` GROUP BY movie * 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. SELECT movie FROM `appearances` GROUP BY movie * 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'.

    // get list of movies
    $query = "SELECT movie FROM appearances GROUP BY movie";
    $args  = array();
    $mrslt = $pdo->prepare($query);
    $mrslt->execute($args);

* 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