Aplicación CRUD AJAX con PDO en ventana Modal

En esta oportunidad veremos el código fuente de una aplicación CRUD AJAX con PDO y Bootstrap, esta aplicación realiza las operaciones básicas de “create, read, update y delete” o más conocido como CRUD, al agregar AJAX a nuestra aplicación no habrá necesidad de actualizar o refrescar la página, además haremos uso del framework de Bootstrap, podrás ver todo el código fuente de esta aplicación y también descargar el código fuente.

Antes debes descargar los archivos de Bootstrap, todos los archivos quedarían como la siguiente imagen:

es momento de crear el archivo connection.php, estas lineas de codigo se encargaran de establecer conexion con la base de datos ademas de hacer uso de la extension PDO.

	
Aplicación CRUD AJAX con PDO
 
 
Aplicación CRUD AJAX con PDO eliminar

Descargar Código fuente

Ahora hay que crear un archivo index.php, en este script se encuentra el diseño de la interfaz principal, aquí se visualiza la tabla y los botones que realizaran la tarea de agregar, editar y eliminar.

Creamos el archivo fetch.php el cual se encargará de llamar los botones de editar y eliminar

Tambien agregamos el archivo fetch_row.php, para llamar el todo los datos agregados a la base de datos.

Para agregar información a la base de datos creamos el archivo add.php

Luego creamos el archivo edit.php, el cual contiene el script para editar lo información agregada anteriormente.

Para borrar datos, creamos un archivo delete.php, este script se encargará de borrar los datos seleccionados.

Descargar Código fuente

instalar

para instalar simplemente debe copiar todo la carpeta en htdocs y ejecutar el script SQL en phpmyadmin luego de configurar la conexión con sus datos en connection.php

Shares:

2 Comments

  • sergio
    sergio
    12 octubre, 2020 at 7:55 PM

    hola.
    Al momento de darle al boton editar no me cargar los datos de la fila en el formulario . que

    tengas un lindo dia.

    Reply
    • anthon
      16 octubre, 2020 at 4:28 PM

      ¿Ya verifico las instrucciones?

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *