Header Ads Widget

Ticker

6/recent/ticker-posts

Cómo recordar datos de formulario

 Cómo recordar los datos del formulario


En realidad, vamos a cubrir muchas probabilidades y finalidades con respecto al formulario que permite a un usuario crear un nuevo hilo en este tutorial. Seguiremos adelante y llamaremos a la publicación "Cómo recordar datos de formulario", ya que esa es mi característica favorita que cubriremos en los siguientes ejemplos. Sin embargo, en primer lugar, agregaremos un enlace para que los usuarios puedan hacer clic directamente en el formulario donde pueden crear un nuevo hilo. A continuación, agregaremos esa gran característica de recordar los datos del formulario cuando un usuario comete un error durante el envío del formulario. Después de eso, agregamos la capacidad de mostrar cualquier error que surja durante el envío de un formulario fallido. También agregaremos un nuevo elemento <select> a nuestro formulario para que los usuarios puedan elegir un canal adecuado. Sin embargo, aún no hemos terminado, así que entremos y arreglemos este formulario.


Agregar enlace para crear un hilo

Ahora agreguemos un enlace para que los usuarios puedan hacer clic para que puedan visitar el formulario que les permite crear un nuevo hilo. Dentro del marcado de app.blade.php, podemos agregar un enlace simple como este:

Esto está funcionando bien, vemos nuestro formulario para crear un nuevo hilo. Agregar datos aquí y luego enviarlos aún no funciona. Necesitamos agregar el marcado para mostrar errores de validación para que podamos ver lo que está sucediendo. Además de esto, sería bueno si el formulario pudiera "recordar" los datos que llenó al hacer clic en Publicar.
el nuevo enlace del hilo está funcionando


Cómo recordar datos de formularios

Si envía un formulario y la validación falla, se le redirigirá de nuevo al formulario. Es horrible que ese formulario borre toda la información que acaba de escribir. Hay una buena manera de asegurarse de que eso no suceda haciendo uso de la función auxiliar antigua () que vuelve a llenar el formulario utilizando sesiones PHPAsí es como lo implementamos. Abra threads / create.blade.php y tenga en cuenta lo siguiente:

¡Agradable! Cuando agregamos información al formulario y luego hacemos clic en Publicar, la validación falla y somos redirigidos de regreso a la misma página. Sin embargo, lo bueno es que nuestro formulario todavía tiene los datos que nos tomamos el tiempo de agregar.


Cómo mostrar errores de validación

Además de recordar los datos que ingresa en el formulario, por supuesto, debemos mostrar los errores reales que hicieron que fallara la validación. Aquí está el marcado habitual que puede ver para ayudar a lograr esto.

Intentemos crear un nuevo hilo de nuevo y veamos cómo funciona ahora. Ah, ja, parece que nos falta el campo de identificación del canal, que es un campo obligatorio de acuerdo con las reglas de validación que habíamos configurado anteriormente.
Cómo mostrar errores de validación


Agregar la capacidad de seleccionar un canal al crear un hilo

Entonces vemos cuál es el problema ahora que estamos mostrando los errores. Nos falta un ID de canal al crear un hilo. Bueno, ¡ni siquiera tenemos una forma de seleccionar un canal cuando intentamos crear un hilo! Necesitamos corregir esto. Revisemos threads / create.blade.php y abordemos esto aquí.

En el área resaltada arriba, configuramos un elemento <select> y luego completamos todos los elementos <option> anidados usando un bucle foreach. Con la inclusión de algunos estilos de arranque, también se ve bien en el navegador. De hecho, podemos crear un nuevo hilo, verlo e incluso agregar una respuesta.

creando un nuevo hilo en acción


Cómo recordar el valor de una opción seleccionada en un <seleccionar>

Ya configuramos la capacidad para que el formulario recuerde el título y las áreas del cuerpo al enviar un formulario y la validación detecta un error. Esto aún no está configurado para cuando un usuario intenta seleccionar un canal. Por ejemplo, elegimos crear un nuevo hilo en el canal repellat, pero nos olvidamos de darle un título al hilo.
elegir un valor de opción en seleccionar

Cuando enviamos el nuevo hilo, la validación encuentra correctamente que falta el título y podemos ver esto en los errores. Sin embargo, observe el canal. Ha vuelto a "Elegir un canal" cuando sería mucho mejor si recordara que ya habíamos elegido el canal repellat. Podemos solucionar ese problema así:

Ahora, podemos seleccionar un canal y enviar nuestro formulario. Si la validación falla, podemos ver que el canal que elegimos ahora se recuerda correctamente. Fantástico.
se recuerda la opción en seleccionar


Cómo agregar validación del lado del navegador

¡Todo está funcionando bastante bien ahora! Lo último que queremos hacer es agregar alguna validación del lado del navegador , que es increíblemente fácil con los navegadores modernos. Todo lo que necesita hacer es agregar el atributo "requerido" a las entradas que desea que sean requeridas y el navegador las verificará automáticamente antes incluso de intentar enviar la solicitud al servidor. Entonces, con la combinación de la validación del lado del navegador y del lado del servidor, estará en buena forma. Aquí agregamos ese atributo.

Si probamos el formulario una vez más, parece que el formulario ni siquiera se envía al servidor, el lado del navegador detecta el problema y nos alerta de inmediato.
validación del lado del navegador en acción


Cómo recordar el resumen de datos del formulario

Como puede ver, cubrimos mucho más que solo recordar datos de formulario en este tutorial. Aprendimos sobre la validación del lado del navegador, recordando un valor de opción de un elemento seleccionado, mostrando errores de validación y otros fragmentos útiles para trabajar con datos de formularios.

Publicar un comentario

0 Comentarios