Formulario con Ventana de Diálogo de Confirmación

/, Diseño Web, jQuery/Formulario con Ventana de Diálogo de Confirmación

Como ya lo hemos visto en los pos relacionados a ventanas de diálogo usando jQuery, jQuery UI y el plugin jquery.Validate podemos crear formularios y ventanas sorprendentes, ahora vamos a crear un formulario que al ejecutarse abrirá una ventana de diálogo que solicitará la confirmación de su envío, para lograr esto usaremos exactamente los mismos script y librerías de los ejemplos antes comentados.

Ya lo he comentado en los post anteriores, no solamente debemos validar con javascript sino también del lado del servidor.

Descargar el código completo desde github

Video Tutorial

Creando la Ventana de Diálogo

Creando el Formulario

HTML Completo

Creamos en el javascript la ventana de diálogo, agregaremos la opción buttons, en el sitio oficial de jQuery UI podemos encontrar a detalle su sintaxis Ahora agregamos la validación del formulario con jQuery Validate, aquí es donde controlamos el envío del formulario mediante la ventana de diálogo

Javascript Completo

Patallas de Muestra
formulario-con-ventana-de-dialogo

 

Archivo Completo formDialog_I.html

By | 2018-03-25T22:33:42+00:00 abril 14th, 2012|Categories: Desarrollo Web, Diseño Web, jQuery|Tags: , , |10 Comments
Desarrollador web front y back end, php, mysql, css3, html5, twitter bootstrap, jquery . . . twitero, bloguero, consultor de IT y padre de dos hermosos bodoques. Visita mi Perfil en Google +

10 Comments

  1. erufenix 4 julio, 2012 at 10:39 AM

    Buen post compa, pero por que no usas console.log() para debugear en vez de un alert()?

    • Luis Fernando 4 julio, 2012 at 11:01 AM

      Gracias mi buen, la verdad no conozco su uso pero lo voy a probar en nuevos proyectos

      Saludos

  2. Jesus 6 agosto, 2013 at 11:33 AM

    Muy buen Post amigo ,me ha ayudado mucho este tuto y de hecho tus demás trabajos 😀

    • Luis Fernando Cázares Bulbarela 6 agosto, 2013 at 12:01 PM

      Hola Jesús muchas gracias por tus amables comentarios, espero me puedas compartir algún día lo aprendido y lo hecho.

      Saludos

  3. Carlos Mejia 7 mayo, 2014 at 12:10 PM

    Buenas amigo, muchas gracias de antemano,

    Siguiendo tu consejo revise este código, y seguí los pasos según tus indicaciones pero me sigue mostrando el alert con el formulario serializado, pero no muestra los errores en los contenedores , estan son las extensiones que use:

    De verdad disculpa la molestia he intentado de varias formas y no doy con el error.

    Antetodo Muchas Gracias

    • Luis Fernando Cázares Bulbarela 7 mayo, 2014 at 2:19 PM

      Hola Carlos buenas tardes ya probaste mi código, no te desesperes, haz el trabajo paso a paso, comienza de sde cero, lo mas seguro es que haya por ahí algún error en la ruta del script y así.

      Saludos

      • Carlos Mejia 8 mayo, 2014 at 9:08 AM

        Epale Luis muchísimas gracias por la ayuda, después de varios intento al final pude resolver gracias a ver tu código, estoy un poco apretado porque ando haciendo un sistema para la tesis de grado y tengo el tiempo contado…

        De verdad muchas gracias….

  4. Jesus 22 diciembre, 2016 at 1:53 PM

    Buenas, disculpa y si lo que quiero hacer es que al dar click en aceptar se escriban esos datos en una base de datos de MYSQL?

    • Luis Fernando Cázares Bulbarela 1 febrero, 2017 at 10:46 PM

      Hola buenas noches lo que debes hacer es suprimir el diálogo de confirmación y realizar el ajax que mande los datos de tu form hacia el servidor y se guarden en una db.

      Saludos

Comments are closed.

Desarrollo Web

Silex - Sistema de Registro