Ejemplo para autocompletar formulario web de forma dinámica utilizando Ajax.

Más sobre el programa :: Requerimientos :: Videos :: Actualizaciones

Una tarea común en el diseño web, es el empleo y uso de formularios web. Muchas veces es necesario desplegar información en campos de formulario de forma automática. Por ejemplo, cuando un usuario selecciona una opción, los demás campos se cargan con valores tomados desde una base de datos.

Este sencillo ejemplo utiliza Ajax y te muestra una forma de rellenar la información de un formulario web de forma dinámica, con la gran ventaja de no tener que recargar la página web para que el usuario pueda ver la información en dicho formulario.

En el script siguiente se ve una demostración, en la que al ingresar un código de cliente en una caja de texto, se completarán los demás campos: Nombre, Apellido, Ciudad y país donde vive, código postal, Dirección, Documento de identidad etc ...

Obviamente este ejemplo puede ser utilizado para cualquier tipo de formulario web, por ejemplo para cargar detalles de un pedido o factura, cargar información de productos de un catálogo online, etc ...

Nota: Este script requiere PHP. Puedes también utilizar otros lenguajes de programación como ASP, ASP.NET, etc .., reescribiendo el código del archivo getClient.php, que es el que permite recuperar los datos dinámicos para autocompletar el formulario.

A continuación puedes ver mas información y cómo implementarlo en tu página o aplicación web.

Mas información sobre el programa.

Indice - Contenido.

Cargar formulario de forma dinámica en Ajax.

En este script AJAX, se ve como autocompletar los campos de un formulario después de que se ingrese un ID de cliente válido.

Los ID de clientes válidos en este ejemplo son 1001,1002,1003 y 1004. Al ingresar cualquiera de los anteriores ID, se mostrarán los datos automáticamente.

Vista previa del ejemplo.

Datos de otro cliente. ( Con número de ID 1002 )

Instalación y uso del ejemplo en tu página web.

Haciendo clic en este enlace, puedes ver una breve descripción que indica los pasos para implementar el script. Haciendo clic en este otro, ver el ejemplo en funcionamiento del formulario dinámico.

En esa página se muestra como:

  1. Añadir el código fuente en la sección HEAD de la página web que permite inicializar algunas funciones y referenciar el archivo Javascript llamado ajax.js.
  2. Insertar código fuente en la sección BODY, para el formulario.
  3. Descargar un archivo SQL para crear una tabla en la base de datos. Esa tabla crea varios clientes con sus respectivos datos: Nombre, Apellido, dirección etc ...
  4. Descripción del archivo getClient.php. Este archivo php es llamado por Ajax cuando un ID de cliente nuevo se incluye en el primer campo de texto. Entonces, se conectará a la base de datos y tratará de encontrar un cliente con el ID de cliente introducido.

Vista previa del código PHP.

 


Requerimientos de instalación y uso.

Requiere : Lenguaje del lado del servidor, por ejemplo  PHP.


Videos tutoriales.

No hay video tutoriales disponibles para mostrar.

Cambios, actualizaciones y mejoras del programa.

Buscar programas


Introduce los términos de búsqueda ...

Enlaces patrocinados.


Detalles y descargar

Web:
http://www.dhtmlgoodies.com
Licencia:
Gratis - Software libre
Versión:
--
Idioma:
Inglés
Programa actualizado:


Si te ha gustado esta página, programa o artículo puedes votar haciendo clic en este botón: