Interact between two different web applications using Javascript - javascript

I have two applications webApp1 and webApp2. In webApp1 , HTML page contains an tag on click of it an HTML page in webApp2 will be opened in new browser window, page contains one text box and save button. If user enters something in text box and click on save button, need to send a notification from webApp2 to webApp1 so that webApp1 can close the newly opened window and perform some operation after closing window.
How can I achieve this using Java script?

What you are looking for is window.opener.
In Webapp1, window 1, you would have a function in javascript that would need to be done after closing.
function AfterClose() {
// code to execute in Webapp1, triggered in Webapp2
}
In Webapp2, within your save function, do the following.
function Save() {
// ...
// code to save your information
// ...
window.opener.AfterClose();
self.close();
}

Why not just call window.close() as part of the save button click function in webapp2?

Related

How do you write Javascript to open page and then click on button on page in one go

I would like to open a particular webpage and then click on a button to open another page from that page. Now I can see how to write Javascript to find a button on page and click on it, what I dont quite understand how I can do that from the 1st page.
i.e on Page 1 can open Page 2, but how do I in one go from page 1 get it to click on a button on page 2 once page 2 is loaded because until Page 2 is loaded the button is not available, and if I just go to Page 2 my Javascript will not be running because that was on Page 1 ?
What I am trying to do is a poweruser feature that makes it easier to do a particular repetitive task, I am the sys adminstator for page 1 but not page 2.
This is example of the page Im trying to do this for
https://acoustid.org/track/61c9656b-6838-4660-8113-86f7f90fd549
You need to login to Acoustid to actually see the Disable buttons
Open new browser window with js (modal or tab)
var newWindow = window.open("http://www.....com");
Add onload handler for new window and insert script (optionally)
newWindow.addEventListener("DOMContentLoaded", Func);
function Func()
{
var script = newWindow.document.createElement("script");
script.text = "alert('hello');";
newWindow.document.body.appendChild(script);
}
Insert js code straightforwardly if you don't need to handle load
Func();

How to get data from JS popup window when window is closing

I'm trying to capture when a form field from a popup window exists when the window is closed. I currently do not have control over the child window, but it is on the same domain as the parent window.
I've looked into using the timer functionality:
var child = window.open(...);
var timer = setInterval(checkChild, 500);
function checkChild() {
if (child.closed) {
<DO SOMETHING HERE>
clearInterval(timer);
}
}
but that won't work for me because I don't think that'll give me access to the child's data.
My popup window has a few form fields for uploading a user's profile image. My question is how would I access whether the user SUBMITTED the form or just simply closed the window? There is javascript in the popup window for the submit button that will handle actually uploading the image, but I would need to somehow capture when they click the "upload" button and be able to see that the user actually had an image to upload submitted.
Thanks in advance!
EDIT:
I went ahead and just looked into the closed window event. I couldn't actually get any data from there, but I was able to read further from the DB on the server-side code to get the data I needed.
You can use the child.onbeforeunload event to get information from the child window before it closes.
As suggested by https://stackoverflow.com/a/15769556/1600851

Parent Jsp page refresh when click on popupwindow alert box

I am working on jsp's, I have two jsp one in configDb.jsp, in that I have written code to retrieve the values from database and display it. In this whereas I have option like newconnection.. its a popup window. When I click on that it opens popupwindow and taken the values and store them in a database, but in my parent page I am not able to display those values. After I click on the ok button in popup window, I have to refresh the parent page, then I am able to see the values which I have created few seconds back by the new connection page. Could anyone please help me out?
You can include this in your HTML for the popup window.
<script type="text/javascript">
function proceed(){
opener.location.reload(true);
self.close();
}
</script>
<form onsubmit="proceed()">
...
</form>
Actually you can obtain the answer by googling "javascript refresh parent page from popup" and you will see stackoverflow's answer :)
A better alternative without the need of refreshing the parent page can be achieved by adding a submit button listener and perform a DOM action to insert the new element with new content. This can be easily done by Javascript.

Refresh a specific page when pop-up is closed (jQuery)

I have a pop-up called PopUp1 (page0.aspx). When the user clicks a row in PopUp1's GridView, it opens a new pop-up that loads my page1.aspx.
If the user clicks a link in the new pop-up (page1.aspx), then the content will be replaced with that of page2.aspx.
What I want: If the user closes the window of my second pop-up that opens page1.aspx or page2.aspx, then refresh PopUp1 (page0.aspx).
How can I do that via jQuery ?
in page1.aspx and page2.aspx add some javascript to refresh their parent (you don't need any jquery for this)
In your markup:
<body onunload="refreshParent();">
In your javascript:
var refreshParent = function () {
if (opener && !opener.closed) {
opener.location.reload();
}
};
Edit: alternatively, if you want to keep your logic seperated from your markup:
$(window).unload(refreshParent);
In your new popup (page1.aspx or page2.aspx), put the following jQuery and it should refresh the opening window when that popup is closed or refreshed:
$(window).unload(function(){
window.opener.location.reload();
});
If you'd like you could also change the location of the opening page by using the .assign method if you want to do some kind of workflow logic in your page,
for example window.opener.location.assign('http://newurl');
You could use plain javascript
window.opener.reload();

How to return value from html popup

I need a terse, clean way to implement this in asp.net mvc (+/- jquery or js)?
User clicks an element in webform A;
Webform B pops up;
User interracts with webform B;
On closing webform B, probably by a submit button, the source element in webform a is updated with a value from webform B
Thanks.
With ASP.NET MVC, I'd probably render a DIV on the page, initially hidden, perhaps via AJAX if the contents depend on values selected on the initial page. I'd use the jQuery UI dialog plugin to popup the dialog. The dialog could contain a form that submits back to the server. You could also use the onclose handler for the dialog to both copy values from the inputs in the dialog for use on the rest of the page. If you populated the dialog via AJAX you could have the server generate the HTML -- say by rendering a partial view and returning it -- or return json and generate the dialog on the fly in the browser.
I've resorted to using cookies. I've found this to be the only reliable way to do this. I'm using GrayBox for my dialog, so I have a function in the dialog that looks like this:
function selectValue(id, name) {
SetCookie("_someuniqueprefix_RetID", id);
SetCookie("_someuniqueprefix_RetValue", name);
parent.parent.GB_CURRENT.hide();
}
Then in my calling page I am launching the dialog which displays a partial in the GrayBox:
$(function() {
var selectUrl = '/_somecontroller/Select';
// attach a method to the chooseButton to go and get a list of
// contact persons to select from
$("#chooseButton").click(function() {
GB_showCenter('Select My thing', selectUrl, 500, 620, function() {
var id = GetCookie("_someuniqueprefix_RetID");
var value = GetCookie("_someuniqueprefix_RetValue");
DeleteCookie("_someuniqueprefix_RetID", "/", "");
DeleteCookie("_someuniqueprefix_RetValue", "/", "");
$("#MyID").val(id);
$("#MyName").val(value);
});
});
});
Also you'll need to grab a function off the web for SetCookie and GetCookie
Hope that helps
You can use javascript from the popup window to call functions on the opener via window.opener. So your popup could call a function on the parent page to pass the data back when the user clicks the submit button.
I'm not sure what your requirements are, but IMO using ajax for this sounds like overkill. If all you need is some form data from the popup webform passed to the opener webform, then there's no need to make a call to the server.

Categories

Resources