Solved

parameter passing from child window to parent window

Posted on 2004-04-02
14
24,279 Views
Last Modified: 2008-09-18
hi,

   my requirment is : I need to click a button on the parent html page. this should open a new child window which has two text fields and two buttons "Ok" and "Cancel".

when i click "Ok" the values in the textfields should be passed to the parent window and stored in two variables.

when i click "Cancel"  the window should be closed and the values inthe textfield if any should not be passed

  If any one has the idea please post the code.

waiting for reply.
0
Comment
Question by:bharat_ko
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
  • 4
  • +2
14 Comments
 
LVL 6

Expert Comment

by:jkna_gunn
ID: 10739405

<input type="button" name="ok" value="Ok" onclick="passValues()">
<input type="button" name="cancel" value="cancel" onClick="window.close();">

<script language="JavaScript">
function passValues()
{
    // pass variable back to parent window
    window.opener.document.yourformname.yourinputfield = document.thischildform.textfield1; // adjust to your needs
 
}
</script>

you will need inputs set up on parent page to pass values back to in above example.
0
 
LVL 6

Expert Comment

by:jarasa
ID: 10739545
You should close the window after clicking ok too

<input type="button" name="ok" value="Ok" onclick="passValues();window.close();">

Javier
0
 
LVL 6

Expert Comment

by:jkna_gunn
ID: 10739567
true, but he never asked for that ;)
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 6

Expert Comment

by:jarasa
ID: 10739577
I guess so :c)
0
 

Author Comment

by:bharat_ko
ID: 10739750
hi jkna_gunn,

 i could not get u with the statment "you will need inputs set up on parent page to pass values back to in above example.".

 can u explain what you mean saying "input setup".

0
 
LVL 6

Expert Comment

by:jkna_gunn
ID: 10739771
sorry what i meant was that inorder to pass information back you will need somewhere to pass them back to
for example an input field (most likely).

so in my code i had this
window.opener.document.yourformname.yourinputfield

so that means on your parent page, you would need a form called yourformname that had an input field called yourinputfield. of course im sure you have these already, so all you need to do is change the names to match your code.
0
 

Author Comment

by:bharat_ko
ID: 10739854
hi jkna_gunn and jkna_gunn,

     can u clearly explain what is "inputs set up on parent page" .

  I think i need to stop execution of next statments on parent window till the child window is closed.


0
 

Author Comment

by:bharat_ko
ID: 10739875
hi jkna_gunn and jarasa,

     can u clearly explain what is "inputs set up on parent page" .

  I think i need to stop execution of next statments on parent window till the child window is closed.


0
 
LVL 6

Expert Comment

by:jarasa
ID: 10739895
Main page -> You have a Form on this page
<Form name=myForm>
<input type=text name=myField1 value="">
</Form>

Child page -> You change the value of a field inside the main page Form
window.opener.document.myForm.myField1.value = "Hello I write this from the Child Window";

You see now how it works??

Javier

0
 
LVL 6

Expert Comment

by:jarasa
ID: 10739914
Don't accept my answer, OK? I'm just explaining you jkna_gunn Solution wich it the correct one.

Javier
0
 

Accepted Solution

by:
mgeiser earned 125 total points
ID: 10740793

try this...


=============================================
Parent Page

function openWindow() {

      //open dialog to get the name of the Template copy
      var url = escape(appRoot + "/activityTemplateModify.do?action=SelectTemplateCopyName");
      var features = "dialogWidth:400px;dialogHeight:225px;scroll:no;status:no;resizable:no;help:no;";

      var inputArgs = new Object();
      inputArgs.templateName = selectedTemplateName;
      inputArgs.templateId = selectedTemplateId;

      var retVal2 = window.window.showModalDialog(url, inputArgs, features);
      if (retVal2 != null) {
             if (retVal2.status == 1) {
                       alert(retVal2.text1)
                       alert(retVal2.text2)
         }
        }
}

=============================================
Cihild page

buttons:
<table class="dialogLayout" id="idCommand" cellpadding="0px" cellspacing="0px" width="100%">
<tr>
<td align="right">
      <input type="button" class="commonButtonH19W54" value="OK" onclick="closeWindow(true);" tabindex="2"/>
      <input type="button" class="commonButtonH19W54" value="Cancel" onclick="closeWindow(false);" tabindex="3"/>
</td>
</tr>
</table>


    function closeWindow(accept) {
        if (accept == true) {
      ret.status = 1;
      ret.text1 = document.getElementById("text1").value;
      ret.text2 = document.getElementById("text2").value;
      window.returnValue = ret
      window.close();
        }
        else {
                //the cancel button was clicked
      ret.status = 0;
      window.close();
        }
    }
0
 

Author Comment

by:bharat_ko
ID: 10746664
thanks for your replies.

 i am getting a script error.

   it says "'ret' is undefined". so i declared 'ret' as

                     var ret = new Object();  in the child window (i.e) modal dialog.

but still i am getting the same error.

can u tell me why is it so.

one more thing. can i get the reference of my parent window variable or object to the child window (i.e) modal dialog. if  it can be done , can you write the code for that



0
 
LVL 6

Expert Comment

by:jkna_gunn
ID: 10747656
// parent page
<script language="JavaScript">
  function openChild() {
       var win = window.open('child.html','Child','width=400,height=275,toolbar=yes,scrollbars=yes,resizeable=yes,menubar=yes,location=yes,status=yes');
   }
 </script>
 <form name="parentForm">
 <input type="text" name="textField1" value="r">
 <input type="text" name="textField2" value="r"><br />
 <input type="button" name="openchild" value="Open Child" onClick="openChild()">
 </form>


// child page
<script language="JavaScript">
  function passValues()
  {
      window.opener.document.parentForm.textField1.value = document.childForm.textField1.value;
      window.opener.document.parentForm.textField2.value = document.childForm.textField2.value;
  }
</script>
<form name="childForm">
<input type="text" name="textField1" value="">
<input type="text" name="textField2" value=""><br />
<input type="button" name="ok" value="OK" onClick="passValues();">
<input type="button" name="cancel" value="Cancel" onClick="window.close();">
</form>
0
 

Expert Comment

by:aotyehel
ID: 11838820
I have tried to alter this last piece of code using radio buttons...but it seems to ignore whether or not the radio buttons are checked or not, so does not pass the values....or rather returns a value of 'undefined'.

As I am not a Javascript whizz....could someone alter the above code to enable a child window to pass through the value of a checked radio button value to one textfield.

This would greatly be appreciated.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Javascript object functions help 1 19
Github api to fetch the number of collaborators in a git repo 1 30
Accordion won't close correctly 5 14
Two decimal 5 29
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

733 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question