We help IT Professionals succeed at work.

Passing value from one page textbox to another page textbox

s_hausen
s_hausen used Ask the Experts™
on
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=600,height=200,toolbar=yes,location=yes,directories=yes,status=yes  ,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes');
}



</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>&nbsp;</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.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
In page2.html write this;

function close_window() {
opener.document.getElementById("Page1_TxtA").value=document.getElementById("Page2_Txt1").value
opener.document.getElementById("Page1_TxtB").value=document.getElementById("Page2_Txt2").value

window.close();
}
leakim971Multitechnician
Top Expert 2014

Commented:
Use for example : opener.document.getElementById("Page1_TxtA").value = document.getElementById("Page2_Txt1").value

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>

Open in new window

leakim971Multitechnician
Top Expert 2014

Commented:
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>&nbsp;</td>
    <td><input TYPE="BUTTON" name="npage" VALUE="Display" onClick="close_window();"></td>
  </tr>
</table>
</form>
</body>
</html>

Open in new window

Author

Commented:
Hi,
After adding the function as under:
function close_window() {
opener.document.getElementById("Page1_TxtA").value=document.getElementById("Page2_Txt1").value
opener.document.getElementById("Page1_TxtB").value=document.getElementById("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???
leakim971Multitechnician
Top Expert 2014

Commented:
@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="+encodeURI(source),'','width=600,height=200,toolbar=yes,location=yes,directories=yes,status=yes  ,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes');

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');
	}

Open in new window

leakim971Multitechnician
Top Expert 2014

Commented:
and we use these parameter to update the right textbox with the right child textbox : opener.document.getElementById( gup("target") ).value = document.getElementById( gup("source") ).value;      

function close_window() {
		opener.document.getElementById( gup("target") ).value = document.getElementById( gup("source") ).value;	
		window.close();
	}

Open in new window

Author

Commented:
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.getElementById( 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?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');
      }
still giving me the same result. textbox A goes clear when values pass into textBox B.
Multitechnician
Top Expert 2014
Commented:
new button too : onClick="open_window('Page1_TxtB','Page2_Txt2')"

just save the code provided and do a test, it work fine for me

do you really have a coldfusion server ?
I see : < cfinput

If not replace by : < input
<input type="button" name="Page1_BtnB" value="Button B" onClick="open_window('Page1_TxtB','Page2_Txt2')"/>

Open in new window

Author

Commented:
I am going to attach both files, for your review and yes I am using Firefox. Is it an issue for javascripts, not to work.
page1.htm
page2.htm

Author

Commented:
No right now, i am testing the files as .html.
leakim971Multitechnician
Top Expert 2014

Commented:
Time to go to bed for me. See you later and Good luck !

Author

Commented:
Thanks for your help sir, I do appreciate it...

Author

Commented:
I am very new in web development, it took me time to understand but finally it works, and thats all counts...
leakim971Multitechnician
Top Expert 2014

Commented:
Thanks for the points! Have a nice week-end!