Saltar al contenido

Display loading image while post with ajax

ajax-image-loading

Pasos y lógica a utilizar:

  1. Paso 1: El div a recargar agregarle con jquery una imagen de fondo
  2. Paso 2: Limpiar el div a recargar
  3. Paso 3: Traer via ajax el contenido nuevo
  4. Paso 4: Eliminar el background insertado en el paso 1

// Image loading *		
$(".payment-summary").css('background', 'url(http://jockey.dev/media/assets/images/wait.gif) #FFF6BF no-repeat 50% 50%');

// Clear area
$(".payment-summary").empty();

//Al cambiar distrito, cambia el summary payment
$(".payment-summary").load("/ajaxcart/paymentsummary?ubigeo="+ $(this).val());

// Delete Image Loading	*	
$(".payment-summary").css('background-image', 'none');

Image loading
wait

Si te ha interesado este artículo y deseas un apoyo o asesoría en algún requerimiento, envíame un mensaje a: (info@juliopari.com) o sino a través de Linkedin: https://www.linkedin.com/in/juliopari/