COMO HACER EFECTO LOADING con AJAX PHP Y MYSQL

Cómo hacer un efecto de carga usando Ajax PHP y Mysql

echo «Hoy aprenderemos como hacer efecto loading con ajax php y mysql al momento de mostrar muchos registros en nuestra página web»

¿En que Consiste?

Este efecto sirve para comunicar al usuario que hay datos por mostrar pero que se encuentran cargando en el servidor.
Cuando uno realiza una consulta en algún formulario de cualquier página web necesitamos este uso ya que es muy importante.
El usuario podría irse o cerrar la aplicación si no hay algún mensaje o Gif que nos indique que esperemos la carga de nuestra consulta.

Lo usual en un formulario de carga son:

  • Gif de rueda en el centro de la pantalla
  • Texto Cargando…
  • Texto Por favor espere mientras realizamos la consulta
  • etc

El POST a continuacion es corto pero muy interesante donde implementaremos un formulario con HTML, PHP, Mysql y Ajax, te enseñaremos desde cero:

  • A Como Usar Ajax
  • Como enviar y recibir los datos de una consulta
  • Mmostrar mensajes por InnerHTML
  • Utilizar Success y Beforesend
  • etc

Cuidado:

No olvides ver el tutorial para que nunca más se te olvide como hacer este formulario en php tan sencillo. El código se encuentra lineas más abajo. No te preocupes que en el POST y en Tutorial aprenderás a Cómo hacer un Efecto Loading Usando Ajax PHP y Mysql.

Nuestra Base de Datos en Mysql se llama registro_usuario, que dentro tiene una tabla llamada usuarios que tiene esta estructura con más de 28mil registros, y sus columnas son:

  • id
  • nombre
  • país
  • ciudad

Empezamos en nuestro archivo index.php, donde llamaremos el uso de jquery en el link dentro de la etiqueta <script> que se encuentra en el <head>. Creamos un estilo para nuestro botón en Css super básico, que lo usaremos para nuestro input de nombre listar, que llamará a la función listar_tabla(); en el onClick. Seguido trabajaremos la función listar_tabla que enviara un paramento por Ajax al archivo listar_ajax.php.

Index.php


conexion.php


En el archivo listar_ajax.php lo que haremos será recuperar el dato enviado por POST de index.php y crearemos una función preguntando por el parametro recibido, esa función nos devolverá una tabla que devolveremos al index.php y lo mostraremos en el success por el innerHtml.

listar_ajax.php


Y como terminando en el index.php exactamente en la parte de beforeSend: function agregaremos el gif de load que usamos en el tutorial para mostrar que hay una carga de datos antes de que aparezca la consulta.

🚀 SUSCRIBETE y sumate a esta comunidad Programadora en mi canal de YouTube haciendo click Aquí.

Contenido Relacionado

REPORTES ESTADISTICOS CON PHP Y MYSQL

⭐⭐⭐⭐⭐ Crearemos 4 tipo de Gráficos para nuestros Reportes Estadísticos con PHP y MySql, ejemplos prácticos Leer Más

SUBIR Y MOSTRAR IMAGENES CON PHP Y MYSQL

⭐⭐⭐⭐⭐ Crearemos un formulario que nos ayudara a subir y mostrar imagenes con PHP y MySql, Leer Más

COMO HACER REPORTES EN PHP PDF WORD Y EXCEL

⭐⭐⭐⭐⭐ Te enseñaré como hacer Reportes en PHP y MySql y exportarlo a PDF Word y Leer Más

COMO SUBIR ARCHIVOS CSV A MYSQL CON PHP

⭐⭐⭐⭐⭐ Aprenderemos como Subir Archivos CSV a MySql con PHP, Crearemos esta herramienta en un Formulario Leer Más

Deja una respuesta

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