s_hausen
asked on
Passing value from one page textbox to another page textbox
Hi,
I've two pages(forms), page2 pops up when we click on page1 form button A or B. On page 2, user can only fills out the TextBox 1 or TextBox 2.
After submitting the Page2 Form, I want to pass the value of Page2 Textbox 1 or 2 to populate on Page1 Textbox A or B(if user click on Button A, value should go to Page1, TextBox A).
Code of page is here 1
<script type="text/javascript">
function open_window() {
window.open('page2.htm','' ,'width=60 0,height=2 00,toolbar =yes,locat ion=yes,di rectories= yes,status =yes ,menubar=yes,scrollbars=ye s,copyhist ory=yes,re sizable=ye s');
}
</script>
<form>
<table width="1023" align="center">
<tr>
<td colspan="2" bgcolor="#E9E9E9">TextBox A</td>
<td bgcolor="#E9E9E9">TextBox B</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">A.
<input type="text" name="Page1_TxtA" id="Page1_TxtA" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnA" value="Button A" onClick="open_window()"/>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">B.
<cfinput type="text" name="Page1_TxtB" id="Page1_TxtB" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnB" value="Button B" onClick="open_window()"/>
</td>
</tr>
</table>
</form>
Page 2 code is here:
<script type="text/javascript">
function close_window() {
window.close();
}
</script>
<form name="form1">
<table width="576" border="1">
<tr>
<td width="273">TEXTBOX 1</td>
<td width="485">TEXTBOX 2</td>
</tr>
<tr>
<td><input type="text" name="Page2_Txt1" id="Page2_Txt1" /></td>
<td><input type="text" name="Page2_Txt2" id="Page2_Txt2" /></td>
</tr>
<tr>
<td> </td>
<td><input TYPE="BUTTON" name="npage" VALUE="Display" onClick="close_window();"> </td>
</tr>
</table>
</form>
any help, comment or suggestion regarding this problem, would be deeply appreciated.
I've two pages(forms), page2 pops up when we click on page1 form button A or B. On page 2, user can only fills out the TextBox 1 or TextBox 2.
After submitting the Page2 Form, I want to pass the value of Page2 Textbox 1 or 2 to populate on Page1 Textbox A or B(if user click on Button A, value should go to Page1, TextBox A).
Code of page is here 1
<script type="text/javascript">
function open_window() {
window.open('page2.htm',''
}
</script>
<form>
<table width="1023" align="center">
<tr>
<td colspan="2" bgcolor="#E9E9E9">TextBox A</td>
<td bgcolor="#E9E9E9">TextBox B</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">A.
<input type="text" name="Page1_TxtA" id="Page1_TxtA" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnA" value="Button A" onClick="open_window()"/>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">B.
<cfinput type="text" name="Page1_TxtB" id="Page1_TxtB" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnB" value="Button B" onClick="open_window()"/>
</td>
</tr>
</table>
</form>
Page 2 code is here:
<script type="text/javascript">
function close_window() {
window.close();
}
</script>
<form name="form1">
<table width="576" border="1">
<tr>
<td width="273">TEXTBOX 1</td>
<td width="485">TEXTBOX 2</td>
</tr>
<tr>
<td><input type="text" name="Page2_Txt1" id="Page2_Txt1" /></td>
<td><input type="text" name="Page2_Txt2" id="Page2_Txt2" /></td>
</tr>
<tr>
<td> </td>
<td><input TYPE="BUTTON" name="npage" VALUE="Display" onClick="close_window();">
</tr>
</table>
</form>
any help, comment or suggestion regarding this problem, would be deeply appreciated.
Use for example : opener.document.getElement ById("Page 1_TxtA").v alue = document.getElementById("P age2_Txt1" ).value
test page :
test page :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function open_window(target, source) {
window.open('page22.html?target='+encodeURI(target)+"&source="+encodeURI(source),'','width=600,height=200,toolbar=yes,location=yes,directories=yes,status=yes ,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes');
}
</script>
</head>
<body>
<form>
<table width="1023" align="center">
<tr>
<td colspan="2" bgcolor="#E9E9E9">TextBox A</td>
<td bgcolor="#E9E9E9">TextBox B</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">A.
<input type="text" name="Page1_TxtA" id="Page1_TxtA" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnA" value="Button A" onClick="open_window('Page1_TxtA','Page2_Txt1')"/>
</td>
</tr>
<tr>
<td colspan="2" bgcolor="#E9E9E9">B.
<cfinput type="text" name="Page1_TxtB" id="Page1_TxtB" value="" size="20" maxlength="40" ></td>
<td bgcolor="#E9E9E9">
<input type="button" name="Page1_BtnB" value="Button B" onClick="open_window('Page1_TxtB','Page2_Txt2')"/>
</td>
</tr>
</table>
</form>
</body>
</html>
page22.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
var gup = function( name ) {
var results = (new RegExp("[\\?&]"+name+"=([^&#]*)")).exec(window.location.href);
if ( results == null ) {return ""}
else {return results[1]}
};
function close_window() {
opener.document.getElementById( gup("target") ).value = document.getElementById( gup("source") ).value;
window.close();
}
</script>
</head>
<body>
<form name="form1">
<table width="576" border="1">
<tr>
<td width="273">TEXTBOX 1</td>
<td width="485">TEXTBOX 2</td>
</tr>
<tr>
<td><input type="text" name="Page2_Txt1" id="Page2_Txt1" /></td>
<td><input type="text" name="Page2_Txt2" id="Page2_Txt2" /></td>
</tr>
<tr>
<td> </td>
<td><input TYPE="BUTTON" name="npage" VALUE="Display" onClick="close_window();"></td>
</tr>
</table>
</form>
</body>
</html>
ASKER
Hi,
After adding the function as under:
function close_window() {
opener.document.getElement ById("Page 1_TxtA").v alue=docum ent.getEle mentById(" Page2_Txt1 ").value
opener.document.getElement ById("Page 1_TxtB").v alue=docum ent.getEle mentById(" Page2_Txt2 ").value
window.close();
}
works fine, but when i pass the value in TextBox B after filling TextBox A, it clears TextBox A. Any comments regarding this issue???
After adding the function as under:
function close_window() {
opener.document.getElement
opener.document.getElement
window.close();
}
works fine, but when i pass the value in TextBox B after filling TextBox A, it clears TextBox A. Any comments regarding this issue???
@chaituu sorry, I did'nt refresh before post my pages
@s_hausen have a look to the code I provided to you.?
I do some modification in your original code :
window.open('page22.html?target='+encodeURI(target )+"&source ="+encodeU RI(source) ,'','width=600,height=200, toolbar=ye s,location =yes,direc tories=yes ,status=ye s ,menubar=yes,scrollbars=ye s,copyhist ory=yes,re sizable=ye s');
@s_hausen have a look to the code I provided to you.?
I do some modification in your original code :
window.open('page22.html?target='+encodeURI(target
function open_window(target, source) {
window.open('page22.html?target='+encodeURI(target)+"&source="+encodeURI(source),'','width=600,height=200,toolbar=yes,location=yes,directories=yes,status=yes ,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes');
}
and we use these parameter to update the right textbox with the right child textbox : opener.document.getElement ById( gup("target") ).value = document.getElementById( gup("source") ).value;
function close_window() {
opener.document.getElementById( gup("target") ).value = document.getElementById( gup("source") ).value;
window.close();
}
ASKER
Guys,
I am very new in web programming, so please be patient with me. After updating the code of page2, submit button doesn't work, which is as under:
function close_window() {
opener.document.getElement ById( gup("target") ).value = document.getElementById( gup("source") ).value;
window.close();
}
and only updating page 1 code as under:
function open_window(target, source) {
window.open('page22.html?t arget='+en codeURI(ta rget)+"&so urce="+enc odeURI(sou rce),'','w idth=600,h eight=200, toolbar=ye s,location =yes,direc tories=yes ,status=ye s ,menubar=yes,scrollbars=ye s,copyhist ory=yes,re sizable=ye s');
}
still giving me the same result. textbox A goes clear when values pass into textBox B.
I am very new in web programming, so please be patient with me. After updating the code of page2, submit button doesn't work, which is as under:
function close_window() {
opener.document.getElement
window.close();
}
and only updating page 1 code as under:
function open_window(target, source) {
window.open('page22.html?t
}
still giving me the same result. textbox A goes clear when values pass into textBox B.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
ASKER
No right now, i am testing the files as .html.
Time to go to bed for me. See you later and Good luck !
ASKER
Thanks for your help sir, I do appreciate it...
ASKER
I am very new in web development, it took me time to understand but finally it works, and thats all counts...
Thanks for the points! Have a nice week-end!
function close_window() {
opener.document.getElement
opener.document.getElement
window.close();
}