Formulario dinámico jQuery con AJAX y PHP

/, jQuery, PHP/Formulario dinámico jQuery con AJAX y PHP

jQuery-con-AJAX-y-PHPjQuery con AJAX y PHP es una de las técnicas mas utilizadas hoy en día para el desarrollo de aplicaciones web, principalmente en el tratamiento de información por medio de formularios que conocemos como dinámicos. En la serie jQuery AJAX para Realizar Consultas con PHP y MySQL aprendimos como realizar este tipo de interacciones. En el video 11 – Creación de interacción para edición de registros y actualización de lista de usuarios – realizamos el llenado de un formulario sin necesidad de interactuar con el servidor lo que en determinado momento es un poco incómodo y resulta poco funcional para edición de registros con muchos mas campos que no están a la vista.

En este artículo aprenderemos a realizar el mismo llenado utilizando jQuery con AJAX y PHP de tal manera que llenaremos de forma dinámica un formulario con datos en formato JSON.

jQuery con AJAX y PHP

Para llevar a cabo el desarrollo de este tutorial es muy importante descargar la estructura de carpetas y librerías que es la base para el desarrollo e implementación de mis tutoriales presentados a partir de marzo del 2014. En este nuevo esquema comenzaré a utilizar las versiones mas recientes y estables de jQuery, jQuery UI, Twitter Bootstrap, Twig y las que se requieran a futuro.

Este tutorial está compuesto esta dividido en dos partes:

  • Video 1: Introducción
  • Video 2: Creación de la plantilla
  • Video 3: Mostrar listado de registros
  • Video 4: Llenar formulario por medio de jquery AJAX y PHP

Conclusión

Sin duda alguna desarrollar un Formulario dinámico jQuery con AJAX y PHP puede llegar a ser una tarea larga y compleja sobre todo para dar mantenimiento a extensas colecciones de datos pero cuando se implementa de forma adecuada y no se abusa en las interacciones puede ser muy efectiva además de permitir al usuario final tener una experiencia de uso mas agradable.

¿NECESITAS APOYO PARA TUS DESARROLLOS WEB?

Desarrollo aplicaciones web a la medida, sistemas integrales de registro y reservación de hospedaje, front y back end, formularios de contacto todo con twig, php, mysql, jquery.

Contáctame

¿Te ha agradado este artículo?

Te invito a compartirlo en tus redes sociales o en su defecto a registrarte en mi newsletter en donde recibirás información de cada nuevo post o tutorial que publique.
By | 2018-03-25T22:33:34+00:00 marzo 18th, 2014|Categories: Desarrollo Web, jQuery, PHP|7 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 +

7 Comments

  1. jQuery Checkbox con AJAX y PHP 2 julio, 2014 at 1:20 AM

    […] Checkbox con AJAX y PHP es un tutorial complementario para otros ejemplos como Formulario dinámico jQuery con AJAX y PHP inclusive en nuestro Formulario Responsivo en Pasos de tal manera que durante la interacción del […]

  2. Ricardo Florez 24 febrero, 2015 at 12:47 PM

    Hola como te va. a ver si me puedes ayudar: mi problema es que tengo unos select dependientes hechos con jquery los cuales no tengo problemas cuando creo un formulario de insertar registros en la base de datos mysql, pero cuando voy a crear el formulario de editar no se como traer en el select el registro que ya esta en la base de datos y poder cambiarlo

    • Luis Fernando Cázares Bulbarela 24 febrero, 2015 at 1:44 PM

      Hola buenas tardes Ricardo hay una función en javascript que lo hace pero he visto que cuando el valor del select es no número no funciona muy bien, en lo personal como utilizo twig cuando voy a realizar edición en ventanas modales y con selects lo rendereo y después lo muestro. En este link esta el javascript jQuery como seleccionar una opción de Select

  3. jose 3 abril, 2015 at 4:39 PM

    Buenas tardes estimado Luis, recien estoy siguiendo tus videosTutos… tengo el siguiente error referente al segundo video, estoy usando Wampserver (2.1, php 5.3.5 y apache 2.2.17)…. agradecido de antemano por tu valiosa ayuda….

    Fatal error: Uncaught exception ‘Twig_Error_Loader’ with message ‘Unable to find template “cargar_datos_con_ajax/layout.html” (looked into: ../views/plantillas).’ in R:\wamp\www\PRUEBAS_CASA\cazaresluis_2014-master\libs\php\Twig\Loader\Filesystem.php on line 202

    Twig_Error_Loader: Unable to find template “cargar_datos_con_ajax/layout.html” (looked into: ../views/plantillas). in R:\wamp\www\PRUEBAS_CASA\cazaresluis_2014-master\libs\php\Twig\Loader\Filesystem.php on line 202

    Call Stack
    # Time Memory Function Location
    1 0.0008 368048 {main}( ) ..\index.php:0
    2 0.0209 1207152 Twig_Environment->display( ) ..\index.php:20
    3 0.0209 1207152 Twig_Environment->loadTemplate( ) ..\Environment.php:307
    4 0.0209 1207184 Twig_Environment->getTemplateClass( ) ..\Environment.php:323
    5 0.0209 1207232 Twig_Loader_Filesystem->getCacheKey( ) ..\Environment.php:265
    6 0.0209 1207232 Twig_Loader_Filesystem->findTemplate( ) ..\Filesystem.php:138

    • Luis Fernando Cázares Bulbarela 3 abril, 2015 at 4:57 PM

      Hola buenas tardes José, muchas gracias por seguir mi trabajo, este error es debido a que tus rutas pueden estar de forma incorrecta, te sugiero lo hagas paso a paso de tal forma que vayas observando donde deja de funcionar. La otra es que descargues la versión mas actualizada de twig y hagas pruebas aisladas con una plantilla sencilla.

      Saludos

  4. Jesus Cruz 28 julio, 2015 at 7:56 AM

    Buen dia Luis

    resulta que tengo que lograr lo siguiente:
    supon que tengo una tabla en una base de datos de MySQL, una columna de esa tabla es el id autoincremental, otra es el nombre de la persona y otra el numero de documento de la persona, lo que debo lograr es que en un formulario yo digite en un campo el numero de documento de la persona y en el otro campo me ponga el nombre correspondiente a ese documento, la verdad agradeceria la ayuda que se me pueda prestar

Comments are closed.

Desarrollo Web

Silex - Sistema de Registro