This course will become read-only in the near future. Tell us at community.p2pu.org if that is a problem.

Adiciona el formulario de contacto



Si ya realizastes el reto de añadir un formulario de contacto con PHP puede que te estes preguntando, ¿Validación? ¿Denuevo?

Pues si, pero esta vez con un enfoque más interesante. Al validar data con PHP nos limitábamos a esperar a que el usuario intentara mandar el mensaje, mientras que utilizando JS podemos validar la data en tiempo real (a medida que la persona va llenando los campos). Validar con JS hace que el proceso se vea más fluido.

El objetivo final de este reto es que cuando tengas un campo vacío se vea similar a esto:

Nombre:|__________| El nombre no puede estar en blanco

Y cuando el campo tenga datos se vea así:

Nombre:|John______| El nombre no puede estar en blanco

Para completar esta tarea:

  1. Crea un nuevo archivo llamado formulario.html y adicionale un formulario con 3 campos: nombre, email y mensaje. 
  2. Asignale un ID a cada campo y a el botón de submit. Puede ser algo como txtNombre para el nombre. Esto nos permitirá trabajar con mayor facilidad en las siguientes tareas.
  3. El action y el method de tu formulario no son relevantes para este reto, así que puedes utilizar lo que desees.

Task Discussion


  • Alejandro J. ALdama Rubio said:

    ya teniedno la estructura, como lo hacemos funionar?

    on June 28, 2012, 7:28 p.m.

    Alexis Hevia said:

    Alejandro, todos los retos están hechos de una serie de tareas, pero me parece que solo estás viendo la primera.

    Para avanzar a la siguiente tarea puedes hacer 2 cosas:

    1. Marcar la tarea como completada (hay un botón verde que dice algo como "Ya terminé")
    2. Dar clic arriba a la derecha donde dice "Acceso Rápido" y avanzar a la siguiente

    Más adelante explicamos cómo hacer todo funcionar.

    on June 29, 2012, 9:43 a.m. in reply to Alejandro J. ALdama Rubio