Pass html form data in bi-directional ways using JavaScript

M

Matt

I have 2 html pages, both have a text box and a button. In page1.html,
when the user enter a text in text box, and click button, it will pass
the form data to page2.html, and it will open page2.html in a smaller
window and that data will show in text box in page2.html. In
page2.html, if the user changes the text box data and click the
button, it will update the data in existing window for page1.html. In
other words, data can transfer back and forth in page1.html and
page2.html.

I already wrote the html pages as shown below. However, after clicking
the button in page1.html, the data can be shown in text box in
page2.html,
But when user changes the text box data in page2.html, it will open
another window for page1.html, not change the data in existing window
for page1.html, and data cannot shown in new window for page1.html
also.
I am just using regular button, and i am not using submit button.

any ideas? Please advise. Thanks!

-------------- page1.html ----------------------------
<html>
<head>
<script>
function openwindow()
{ var myObject = new Object();
myObject.firstName = fname.value;
alert(myObject.firstName);
var sReturn = window.showModalDialog("page2.html", myObject,
"menubar=no, titlebar=no, toolbar=no, location=no, directories=no,
status=no, menubar=no, scrollbars=yes, resizable=no, copyhistory=yes,
width=400, height=500");
}
function window_onload()
{ alert("window onload...");
if (window.dialogArugments != null)
{
alert("window.dialogArguments != null");
var oMyObject = window.dialogArguments;
fname.value = oMyObject.firstName;
}
else
{ alert("window.dialogArguments = null");
}
}
</script>
</head>
<body onload="window_onload()">
<H2>Page 1</H2>
<P>name: <input type="text" name="fname">
<P><input type="button" value="validate" onclick="openwindow()">
</body>
</html>


------------------------ page2.html --------------------------
<html>
<head>
<script>
function openwindow()
{ var myObject = new Object();
myObject.firstName = fname.value;
alert(myObject.firstName);
var sReturn = window.showModalDialog("page1.html", myObject,
"menubar=no, titlebar=no, toolbar=no, location=no, directories=no,
status=no, menubar=no, scrollbars=yes, resizable=no, copyhistory=yes,
width=400, height=500");
}
function window_onload()
{ alert("window onload...");
// if (window.dialogArugments != null)
// {
// alert("window.dialogArguments != null");
var oMyObject = window.dialogArguments;
fname.value = oMyObject.firstName;
// }
// else
// { alert("window.dialogArguments = null");
// }
}
</script>
</head>
<H2>Page 2</H2>
<body onload="window_onload()">
<P>name: <input type="text" name="fname">
<P><input type="button" value="validate" onclick="openwindow()">
</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,582
Members
45,057
Latest member
KetoBeezACVGummies

Latest Threads

Top