From a child window or a small window once opened, we can transfer any user entered value to main or parent window by using JavaScript. You can see the demo of this here. Here the parent window is known as opener. So the value we enter in a child window we can pass to main by using opener.document object model. So if the name of the form in parent window is f1 and the text box where we want the value to be passed is p_name ( in parent window ) then from the child window we can access them by using the object. opener.document.f1.p_name The value for this object can be assigned like this Related Tutorial• Refreshing the parent window• Opening Windowopener.document.f1.p_name.value="Any value";Related Tutorial• Refreshing the parent window• Opening Window We will try to make it interactive so we will assign this to a value entered by the user. Then we will use one input box in child window and name it as c_name. So we can pass the value of the input box of child window to the parent window input box by this line. opener.document.f1.p_name.value = document.frm.c_name.value; We will keep this line inside a function and call this function on click of a button. Inside the function after executing the above line we will add the code to close the child window. Like this .. opener.document.f1.p_name.value = document.frm.c_name.value;self.close();Here is the demo, Click the button ( take care of popup blocker of your browser ) and enter your name in child window opened. Then once closed it will be available at parent window. Your Name Click here to open the child window To open the child window this is the code used in parent window
<form method=post action='' name=f1>
<table border=0 cellpadding=0 cellspacing=0 width=550> <tr>
<td ><font size=2 face='Verdana'>Your Name</font><input type=text name='p_name' size='8'>
<a href="javascript:void(0);" NAME="My Window Name" title=" My title here "
onClick=window.open("child3.html","Ratting",
"width=550,height=170,left=150,top=200,toolbar=1,status=1,");>Click here to open the child window</a>
</td></tr> </table></form>
Inside the Child window code is here
<html>
<head>
<script langauge="javascript">
function post_value(){
opener.document.f1.p_name.value = document.frm.c_name.value;
self.close();
}
</script>
<title>(Type a title for your page here)</title>
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000"> <form name="frm" method=post action=''>
<table border=0 cellpadding=0 cellspacing=0 width=250>
<tr><td align="center"> Your name<input type="text" name="c_name" size=12 value=test> <input type=button value='Submit' onclick="post_value();">
</td></tr>
</table></form>
4 comments:
Hello there! This is my first comment here so
I just wanted to give a quick shout out and
tell you I genuinely enjoy reading through your articles.
Can you recommend any other blogs/websites/forums that deal with the same subjects?
Thank you!
Also visit my website; Dayton Movers
Hi there would you mind letting me know which hosting company you're working with? I've
loaded your blog in 3 different web browsers and I must say this blog loads a lot faster then most.
Can you recommend a good web hosting provider at
a honest price? Thanks, I appreciate it!
Here is my web page :: akribos
Wow! After all I got a web site from where I be capable
of in fact get helpful information concerning my study and knowledge.
Here is my web page: air jordan femme
Great post. I used to be checking constantly this weblog and I'm impressed! Very useful information specially the closing part :) I deal with such info much. I used to be looking for this certain information for a long time. Thanks and good luck.
Have a look at my web page - women's stuhrling Original Watches
Post a Comment