Actualizar ventana padre desde popup: JavaScript Ejemplos

Actualizar ventana padre desde popup: JavaScript Ejemplos

Actualizar ventana padre desde popup. Si tenemos una ventana padre que lanza una ventana popup hijo y que al lanzarlo podemos modificar algunos criterios por ejemplo nombre, apellidos que son datos extraídos de la base de datos, sin embargo, podemos modificarla en una ventana emergente. Esta ventana tiene que actualizar una variable dentro de un formulario, una vez hecho los cambios la ventana padre se tiene que refrescar al cerrar la ventana hijo. Bien, aquí les muestro en código a implementar.

window.opener.location.reload();

Con este script que es propio del lenguaje JavaScript podremos realizar nuestro cometido de actualizar la ventana padre. Es muy útil cuando estemos desarrollando alguna aplicación web, para actualizar datos de manera dinámica y eficaz.

💣 Descarga sistemas PHP y Laravel COMPLETOS GRATIS
Recursos premium listos para usar en proyectos reales 💻
👥 +1000 desarrolladores · 🔥 Publicaciones diarias
🔥 Unirme al canal GRATIS ahora 👥 Grupo de Facebook
⏳ Enlaces disponibles por tiempo limitado
💻 Sistemas completos 🔌 Plugins PRO ⚡ Scripts listos 🔥 Recursos exclusivos

Ahora les mostrare dos ejemplos de cómo implementarlo en nuestros trabajos.

Refrescar ventana padre

Actualizar ventana padre desde popup: JavaScript Ejemplos

Ejemplo #01

Código Javascript

<form method="post" aaction="index.php">
<input onclick="window.opener.location.reload(); window.close();" value="Cerrar">
</form>

Explicaremos el siguiente código

  • Utilizando un formulario de método post o get
  • Dentro de una caja input mediante OnClick llamaremos al JavaScript.
  • Utilizamos reload para refrescar  y close() para cerrar la ventana.

Ejemplo #02 Funciones JavaScript

<script type="text/javascript">
function cargar(){
    opener.location.reload();
    window.close();
}
</script>

Ahora llamarlo desde el HTML

    <form method="GET">
        <input type="text" name="Apellidos" id="Apellidos" />
        <input type="submit" id="actualizar" value="Actualizar Datos" onclick="cargar()"/>
   </form>

Otro método para lograr este propósito detallaremos

  • Mediante una declaración en el head, la función para ejecutar tal propósito.
  • La función se llama cargar().
  • Por ultimo lo llamamos con el OnClick dentro de un input.

Cabe resaltar que OnClick se puede utilizar en etiquetas de enlace, etc.

Actualizar ventana padre desde popup JavaScript Ejemplos
Actualizar ventana padre desde popup JavaScript Ejemplos

[button-blue url=»https://www.baulphp.com/Ejemplos/JavaScript/Actualizar-ventana-padre-desde-popup/VentanaPadre.html» target=»_blank» position=»left»]Ver Demo[/button-blue]

[divider]

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en una estrella para puntuarlo!

Promedio de puntuación 5 / 5. Recuento de votos: 1

Hasta ahora, ¡no hay votos!. Sé el primero en puntuar este contenido.

2 comments

Leave a comment

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