Ver Mensaje Individual
  #1 (permalink)  
Antiguo 13/03/2019, 14:20
Avatar de cassini
cassini
 
Fecha de Ingreso: julio-2009
Mensajes: 98
Antigüedad: 14 años, 9 meses
Puntos: 0
Actualizar registros en ventana padre insert ajax

hola buen día me ando iniciando en esto de ajax y tengo una duda, espero darme explicar.

Estoy desarrollando un sistema php, mysql y ajax

Tengo mi pagina principal (registros-db.php) donde muestro la tabla con los registros de la bd que obtengo con ajax. este es mi codigo

Código Javascript:
Ver original
  1. function obtener_datos(){
  2.         $.ajax({
  3.             url: 'consulta-db.php',
  4.             method: 'GET',
  5.             success: function(data){
  6.                 $("#contenido").html(data);
  7.             }
  8.         });
  9.     }
  10.     obtener_datos();

mi pagina principal (registros-db.php) solo tiene un div id="contenido" donde carga todo, y un link a una ventana secundaria (form.php) que se abre con la librerira fancybox, donde muestro un formulario para agregar un nuevo registro

envió los datos con ajax con este código
Código Javascript:
Ver original
  1. $("#envia").submit(function(e){
  2.  
  3.         e.preventDefault();
  4.  
  5.         var cedula = $("#cedula").val();
  6.         var nombre = $("#nombre").val();
  7.         var fecha = $("#fecha").val();
  8.         var cargo = $("#cargo").val();
  9.  
  10.         $.ajax({
  11.             url: 'insert.php',
  12.             method: 'POST',
  13.             data: {cedula: cedula, nombre: nombre, fecha: fecha, cargo: cargo},
  14.             success: function(dato){
  15.                 obtener_datos();
  16.                 console.log(dato);
  17.             }
  18.         });
  19.        
  20.     });

todo bien hasta ahora se muestran y se insertan los registros.

Mi problema viene cuando quiero que al enviar el nuevo registro con ajax me actualice la tabla que está en la ventana padre, sin necesidad de recargar la pagina.

Yo creí que esto seria posible al invocar la función obtener_datos() dentro del success del submit del envió de los datos, como se ve en el código anterior, pero no lo hace y no manda ningún tipo de error la consola.

Cabe mencionar que todo mi código ajax esta en un mismo archivo ajax.js que cargo en las dos paginas. Dejo el codigo completo de este archivo al final.

Que podrá estar pasando, que me falta, que ignoro? les agradezco mucho su ayuda y sus consejos

ajax.js

Código Javascript:
Ver original
  1. $(document).ready(function(){
  2.     function obtener_datos(){
  3.         $.ajax({
  4.             url: 'consulta-db.php',
  5.             method: 'GET',
  6.             success: function(data){
  7.                 $("#contenido").html(data);
  8.             }
  9.         });
  10.     }
  11.     obtener_datos();
  12.  
  13.     $("#envia").submit(function(e){
  14.  
  15.         e.preventDefault();
  16.  
  17.         var cedula = $("#cedula").val();
  18.         var nombre = $("#nombre").val();
  19.         var fecha = $("#fecha").val();
  20.         var cargo = $("#cargo").val();
  21.  
  22.         $.ajax({
  23.             url: 'insert.php',
  24.             method: 'POST',
  25.             data: {cedula: cedula, nombre: nombre, fecha: fecha, cargo: cargo},
  26.             success: function(dato){
  27.                 obtener_datos();
  28.                 console.log(dato);
  29.             }
  30.         });
  31.        
  32.     });
  33.  
  34. });

gracias de antemano!
__________________
Humildad, ante todo humildad