Popups
<html xmlns="https://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script language="Javascript" type="text/javascript">
<!--
var popup; //A global variable that will act as the Popup ID
function makeExternalPopup() {
//Create the popup and store the returning id in the variable
popup = window.open("pop.htm", "popup_id", "scrollbars,resizable,width=300,height=400");
}
function getData() {
if(!popup) {
alert("Please create the popup first.");
return;
}
//Access the popup elements using this ID and fetch data from it
var data = popup.document.getElementById('popup_data').value;
document.frm.txt.value = data;
}
function putData() {
if(!popup) {
alert("Please create the popup first.");
return;
}
//Access the popup elements using this ID and put data into it
var data = document.frm.txt.value;
popup.document.getElementById('popup_data').value = data;
}
function createPopup() {
//Get the data from the form fields
var background = document.custom.back.value;
var title = document.custom.title.value;
var text = document.custom.text.value;
//Now create the HTML code that is required to make the popup
var content = "<html><body bgcolor='"+background+"'><h1>"+title+"</h1>"+text+"<br /></body></html>"
var pops = window.open("","window","resizeable,width=400,height=300"); //Create the popup
pops.document.write(content); //Write content into it.
pops.document.close();
}
//-->
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<a href="javascript:makeExternalPopup();">Open Popup</a>
<input name="txt" type="text" value="Main Window Data" id="main_window_data"><br />
<input type="button" value="Get data from the popup" onclick="getData()"><br />
<input type="button" value="Put data into the popup" onclick="putData()"><br />
<input type="button" value="Close Popup" onclick="popup.close()"><br />
</form>
</body>
</html>
Pop.htm
<html xmlns="https://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<script language="Javascript" type="text/javascript">
<!--
function getData() {
var data = window.opener.document.getElementById('main_window_data').value;
document.frm.txt.value = data;
}
function putData() {
var data = document.frm.txt.value;
window.opener.document.getElementById('main_window_data').value = data;
}
//-->
</script>
</head>
<body>
<form name="frm">
<input name="txt" type="text" value="This is some Text" id="popup_data"><br />
<input type="button" value="Get data from main window" onClick="getData()"><br />
<input type="button" value="Put data into main window" onClick="putData()"><br />
<input type="button" value="Close Popup" onClick="window.close()"><br />
</form>
</body>
</html>
