Tutorial de formulario PHP-JQUERY-AJAX-XHTML-CSS

33 Replies

Hola, estoy creando un tutorial explicativo para que los mas nuevos aprendan a crear algo que hoy en dia es muy utilizado en las aplicaciones online, un formulario de contacto, después veremos como crear cosas mas complejas partiendo de esto.

Es el mismo principio para crear formularios que inserten información en bases de datos o que hagan determinada acción, etc.
Lo que intento realizar aquí es combinar distintos lenguajes de los que he venido publicando tutoriales, entre ellos, php, y javascript, he dividido el tutorial en 6 partes para que sea mas facil y comprensible su lectura.

El orden de los tutoriales es el siguiente (por si alguien anda medio despistado):

Hola, debido a que el servidor donde estaba almacenado el código del tutorial ya no esta X.X (RIP megaupload) he subido el proyecto a otro servicio para compartir archivos, tienen 2 opciones:

Dropbox
Descargar formulario bonito hecho con php-jquery-ajax-xhtml-css (Descargan tutorial.zip)

Skydrive
Descargar formulario bonito hecho con php-jquery-ajax-xhtml-css (pueden ver la estructura del proyecto y ahi mismo descargar tutorial.zip)

salu2

33 thoughts on “Tutorial de formulario PHP-JQUERY-AJAX-XHTML-CSS”

  2. Leonardo

    Hola Alex, está interesante el material. ¿Ya desarrollaste las partes que indicas allí que están pendientes? Yo podría echarte una mano si lo aceptas.

    Reply ↓
    1. Alevsk Post author

      Hola Leonardo, gracias por visitar el blog, aun no escribo esos post por falta de tiempo, pero ya agende un horario para hacer esas partes que faltan mañana (terminare el tutorial de una vez por todas xD).

      salu2

      Reply ↓
  3. J SILVA

    GENIAL. NECESITABA ALGO ASI HACE TIEMPO, LASTIMA QUE NO ENCONTRE TUS POSTS ENTONCES, PERO ME SERVIRAN PARA OTRAS COSAS.

    Reply ↓
  4. J SILVA

    ESTABA CHECANDO TU SITIO Y ME GUSTO EL ESTILO QUE TIENE, SOY PROGRAMADOR WEB Y DIGAMOS SOY BUENO EN ESO, PERO PARA DISEÑAR EL ESTILO VISUAL DE PÁGINAS SOY UN ASCO, PODRIAS RECOMENDARME ALGUNOS TUTORIALES, LIBROS. ETC. QUE CONSIDERES SEAN DE UTILIDAD PARA LLEVAR ACABO TODO EL PROCESO DE DISEÑO?
    GRACIAS POR ANTICIPADO.

    Reply ↓
    1. Alevsk Post author

      Hola, en mi opinion el mejor consejo que te puedo dar es que uses la creatividad :), puedes primero realizar el mockup de tu sitio (un dibujo a lapiz si deseas) y despues ya teniendo conocimientos sobre css (hojas de estilo en cascada) y javascript (te recomiendo que aprendas a utilizar alguna libreria como jquery) se sera muy facil comenzar a pasar a codigo tu idea :), sobre libros y tutoriales te recomiendo los video tutoriales del maestro Jesus Conde que puedes encontrar en http://www.videotutoriales.com

      salu2

      Reply ↓
      1. Javier

        Muchas gracias, lo espero, este si que se ve demasiado de bueno! trae el html para insertarlo directo a la plantilla y no insertarlo por frame

        Reply ↓
  10. GnnSLxndR

    Excelente formulario compa, yo le estoy tirando a la onda ha jquery ya se lo basico,css3 y html 5 creo q me defiendo a la perfeccion pero para diseñar y que se vea Bonito me falta bastante hahahahaha.
    una pregunta…
    quiero manejar perfectamente ajax con jquery! que libro me recomienda o videotutorial?

    graxx por compartir tu codigo voy a ojearlo para ver como trabajas ajax

    saludes!

    Reply ↓
  13. fabian

    Que tengo que hacerle para que cuando le den enviar formulario, esa informacion llegue por ejemplo al correo del dominio de mi empresa o al mio personal?

    Gracias

    Reply ↓
  14. Helen

    Pregunto lo mismo que Fabian, necesito que el mensaje llegue a una casilla de correo, agradezco la respuesta ya que el formulario esta muy bueno

    Reply ↓
  15. Alevsk Post author

    Hola @fabian y @Helen, gracias por su interés en el tutorial, para hacer lo que ustedes quieren es bastante sencillo, tan solo tienen que modificar el archivo mail.php y en la linea donde esta el siguiente código:

    mail(“[email protected]”, “Comentario desde la Web”, $mensaje, “From: Sitio“);

    Deben de modificar [email protected] por el correo donde deseen que llegue el mensaje :).

    Cualquier duda por favor pónganla en comentarios y tratare de responder a la brevedad posible.

    salu2

    Reply ↓
    1. Helen

      Gracias por la respuesta, pero sabes que probe subir el formulario tal cual a un dominio y me anda perfecto. Lo probe en la pagina web que estoy desarrollando y no me funciona, puse el php, todos los js, y nada nada, algo me debe estar faltando, hace horas que lo estoy tratando de resolver, lo loco es que se que funciona 🙁
      Si queres echar un vistazo el formulario esta en http://www.verapelle.com.ar/contacto.html :/

      Reply ↓
      1. Helen

        Ya lo solucioné! Yo habia sacado el campo de “sitio web” y me generó este problema, lo deje y anda lo mas bien, no se por que pero todavia no tengo los conocimientos suficientes para adaptarlo con un campo menos. Muchas gracias por compartirlo!

        Reply ↓
        1. Alevsk Post author

          Me alegra mucho que hayas resuelto el problema :), una disculpa que no pude responder antes es que estaba haciendo algunos cambias en la plantilla del blog hehe y tengo que estudiar para un examen de mañana, bueno cualquier duda sabes donde contactarme :3.

          salu2

          Reply ↓
  16. Christopher Ordenes

    Gracias por el tutorial, me ha despejado de varias dudas que tenia.

    Slds y nuevamente gracias!!!!

    Reply ↓
  18. emerson

    hola Alevsk excelente titorial lo he seguido y funciona muy bien pero tengro problemas con campos de tipo select para hacer las validaciones, me podria ayudar diciendome como se hacen en este tipo de formulario. desde ya mil gracias

    Reply ↓

Leave a Reply to Alevsk Cancel reply

Your email address will not be published.