Invoke a function from a popup window, then proceed to close the popup window and refresh the parent page

When a link in the parent window is clicked, it opens a child window. Now, when the save button is clicked in the child window, I need to trigger a Struts action, close the child window, and reload the parent window.

function closeChildWindow(){
document.forms[0].action="/rms/action/linkSourceList";
document.forms[0].submit();
var originalSource = document.getElementById("originalSource").value;
opener.location.href = '../action/editSource?source_id='+originalSource;
}

I attempted to use the above code in the child window. While this code successfully reloads the parent window, it does not execute the desired action from the child window. Any suggestions on how to resolve this issue would be greatly appreciated. Thank you in advance! :)

Answer №1

If you want to simplify things, consider implementing a JavaScript library.

Here's a sample code snippet using jQuery:

function submitAndCloseChildWindow(){
    var data = /* retrieve form data */;
    $.ajax({
        url: "/rms/action/linkSourceList",
        data: data,
        method: "POST"
    }).done(function() {
        opener.location.href = '../action/editSource?source_id=' + $("#originalSource").val();
        window.close();
    });
}

This approach will allow the window to remain open in case of failure and enable you to manage any anticipated errors. Additionally, check the console for further troubleshooting if the request fails to go through.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the best way to retrieve data from ng-controller to use in the 'src' attribute of an <img> tag?

Check out this snippet of HTML: <div data-ng-controller="sampleCtrl" > <ul data-ng-repeat="item in sampleData"> <li class="message"> <img src="img-source" width="30" height="30"> <div class="message-text"> ...

Setting up Laravel Mix Vue.js source maps to display actual component code during debugging

My current setup includes Laravel 5.4 and Vue.js 2.6. I'm facing an issue with viewing the sourceMap of *.vue component files in the console. Here is how I've configured Laravel mix: let mix = require('laravel-mix'); mix.webpackConfig ...

Navigating through the year selection with your keyboard

By default, a dropdown menu containing years allows for keyboard navigation. For example, if you type in 1992 while the dropdown is selected, it will automatically move to that specific year option. I am curious to know if there is a way to activate a two ...

Is it possible to change the background color using jQuery?

Can you assist me with this: I have a website and I am looking to modify the bg-coler when hovering over the menu (similar to how it works on the rhcp-website). I attempted using jquery for this, but unfortunately, it did not yield the desired result.. ( ...

Issues with jQuery .on() hover functionality in HTML5 select element not being resolved

I'm currently working on capturing the event triggered when the mouse hovers over a select box, regardless of whether it's collapsed or expanded. My approach involves using .on() in the following manner: $(document).on('hover', "select ...

Implement Google Apps Script Array in HTML form for autocompleting datalist suggestions

I have successfully created a Google Scripts function that generates an array from a column in a Google Sheet by filtering out any spaces. However, I'm facing a challenge in figuring out how to pass this variable to my HTML form so that I can set up a ...

When the mouse hovers over DIV2, the background image of DIV1 will be replaced

I have a full-screen background div with the ID #background-change. Within that full-screen background, I have 3 Divs named .fullscreen-column-1, .fullscreen-column-2, etc. My goal is to change the background image of #background-change when the mouseove ...

Send an AJAX request to redirect to a different page on a PHP server

After collecting data from JavaScript, my page transfers it to PHP and then MySQL. The issue arises when I want the page to redirect to different pages based on the database content. I attempted to use the header function, but it only displayed the entire ...

Fill in input field based on choice from the drop-down menu - JavaScript

I am facing an issue where I cannot add text inside the text box based on the dropdown selection. For example, if I select option2 from the dropdown, the textbox should be populated with option2. (function() { 'use strict'; setInterva ...

Hide the div element once the timer runs out

Struggling to make a timer disappear when it reaches 00:00, every attempt results in the div being hidden immediately. Check out the code snippet I've been working with: $(document).ready(function(e) { var $worked = $("#worked"); function upd ...

Incorporate text onto an image using Semantic UI

Currently, I am utilizing Semantic UI to display images. While it is functioning well for me in terms of adding text near the image, I desire to have the text positioned on top of the image. Ideally, I would like it to be located on the lower half of the i ...

The $q.all() function in angular seems to struggle with resolving properly

Having trouble with 3 $http calls in a factory. Creating 4 promises: var promise = $q.defer(), PBdeferred = $q.defer(), Rdeferred = $q.defer(), Pdeferred = $q.defer(); Making the first call to the API: $http.get('/pendingBills').then(fu ...

Encountering a discord bot malfunction while on my Ubuntu server

My discord bot runs smoothly on my Windows 10 setup, but when deployed to the server running Ubuntu Server 20, it encounters a specific error. The issue arises when trying to handle incoming chat messages from the server. While I can read and respond to m ...

What causes the never-ending loop in this React GET request?

Before we begin, take a moment to review the code provided below. const [currentUserPK, setCurrentUserPK] = useState(undefined); const [currentPage, setCurrentPage] = useState(1); const [rowsPerPage, setRowsPerPage] = useState(10); // API ...

Adjust the divs right element by adding or removing 1 pixel for every size change in the browser

I have been exploring different approaches to achieve this task and it seems like using javascript might be the most effective way. I am currently dealing with a stubborn social icon container placement issue. More details on my previous question can be fo ...

Calculating the k-coreness of a node in a graph with the help of J

Currently, I am utilizing JUNG for conducting social network analysis. I am interested in learning the method to execute the K-Coreness of a specific node in a graph using JUNG. Alternatively, if there is another library available that I can utilize to cal ...

Tips for scheduling tests to run only after the @AfterTest method has completed

I am currently learning how to use Selenium Webdriver in Java along with TestNG. My testing focus is on the Google Login page. One issue I am facing is running test cases sequentially. My desired sequence is: Run @BeforeTest Execute Test number 1 (Login ...

Conceal the information within a table using angular js and HTML

Just starting out with angular and I have a table that displays angular data directly in the HTML without any controller or model. <table width="98%" border="0" cellspacing="1" cellpadding="2" class="labels" align="center" id="locc"> <tr style ...

Encountering a ReferenceError in React-Native with abcjs library: Element variable not found

import abcjs from 'abcjs'; export default class MusicScore extends Component { constructor(props) { super(props); this.state={ data: this.props.navigation.getParam('abctune'), } } render( ...

Tips for loading JSON data into the select2 plugin

My goal is to extract the last two letters (in this case "VA") from the data attribute (data-code="US-VA") of a jvectormap-element using JVectormap. I want to compare these letters with State objects in the database and then load corresponding counties in ...