Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 202
  • Last Modified:

Using a popup window to retrieve user input like using prompt

Hi All

Im trying to get some information from a user while a script is actually in the process of running and at the moment im using prompts to get the info from the user.

What i would like would be to have 1 pop up window appear with form boxes in it, then when the user clicks ok on the form, these variables are passed back to the main script and converted into variables

so this is what i have so far

function writeIt()
{
var varA== prompt('Enter var A:', '1');
var varB== prompt('Enter var B:', '1');
var varC== prompt('Enter var C:', '1');
var varD== prompt('Enter var D:', '1');

document.write(varA+varB+varC+varD);
}

<a href="#" onClick="writeIt()">click</a>


so that will get each variable by using the prompt window and write the results to the screen when the user clicks on the link click.

anyone know how i can do the same thing but just pop up a window and do it

ive tried window.opener but it just freezes the parent page because i assume its trying to assign values when the code is still running in the background

so ive tried this

function writeIt()
{
var newWindow;
var urlstring = 'testpop.htm';
var myWindow = window.open(urlstring,'','height=200,width=280,toolbar=no,minimize=no,status=no,memubar=no,location=no,scrollbars=no');
myvar=document.myform.fa.value;

document.write(myvar);
}

(on this page is a text field called fa in a form called myform)

the testpop.htm code is like this

function retVals()
{
window.opener.document.myform.fa.value=document.form1.tfa.value;
}

and is ran when the user submits the form.

This doesnt work though as i say the main page just freezes.

Any ideas?
0
harveyball
Asked:
harveyball
  • 5
  • 2
1 Solution
 
ellandrdCommented:
the popup window contains a form & I want to pass back the form data to a javascript function in the parent window right?


well use

<input type="button" onClick="opener.functionName(this.form.myField.value)" VALUE="Send">
0
 
harveyballAuthor Commented:
yes but the pop up is called from the function

sooooo

function blah()
{
open the window

get the vars

write the vars
}

will not work because the function will not wait for you to get the vars

this works however


function blah()
{
open the window

alert(blah)
get the vars

write the vars
}

so you have to type the details into the pop up window hit the submit on the popup, then hit the alert button on the main window

but that looks messy, i want a way of passing the variables back from the pop up window from within the function call

i thought about a while loop to wait until the pop up was closed but a. that would be a silly loop and b. while(!window.opener.closed) didnt do anything
0
 
ellandrdCommented:
right ok, give me a few mins as im trying to figure out a way to solve your problem...

your solution is kinda working, but want to make a few changes before i post it! ok?

sean
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
ellandrdCommented:
do you want the popup window to open as soon as the parent window is opened on runtime or do you want the user to click a button to open the popup window??
0
 
riyasjefCommented:
Hi

put thes fn in ur parent window

function display()
{

var myvar=document.myform.fa.value;
document.write(myvar);

}

function writeIt()
{
var newWindow;
var urlstring = 'testpop.htm';
var myWindow = window.open(urlstring,'','height=200,width=280,toolbar=no,minimize=no,status=no,memubar=no,location=no,scrollbars=no');
}


and change the fn in popup as

function retVals()
{
window.opener.document.myform.fa.value=document.form1.tfa.value;
window.opener.display();
}



0
 
ellandrdCommented:
<###### HTML code for main.html ######>

<html>
<head>
<script language="javascript">
<!--
var ls_value = 0;
function call() {
      newWin =window.open("childwnd.html", 'TheNewWin', 'height=500, width=700, top=180, left=180,fullscreen=no, scrollbars=yes, resizable=yes, menubar=yes, toolbar=yes, location=yes, directories=yes, status=yes');
}

function getValue() {
      document.write("Value is : " + ls_value);
}
//-->
</script>
</head>
<body onload="call();">
<a href="#" onClick="getValue();">Value from pop window</a>
</body>
</html>


<###### HTML code for childwnd.html ######>
<html>
<head>
<script language="javascript">
<!--
function call_return() {
      //var ls_text = document.frm_child.text1.value
      var ls_text = document.frm_child.t1.value;


      self.opener.ls_value = ls_text
      self.close();
}
//-->
</script>
</head>
<body>
<form name ="frm_child">
<input type="text" name="t1" size="20">
<input type="button" value="Submit" name="btn1" onClick ="call_return();">
</body>
</form>
</html>

should work now

any problems post them back

regards
 
-sean-
0
 
ellandrdCommented:
UPDATE ON ABOVE CODE!

i made it work better as i found a different way to solve your prob and this is works better...

try this...


<###### HTML code for main.html ######>
<html>
<head>
<script language="javascript">
<!--
function call() {
      newWin =window.open("childwnd.html", 'TheNewWin', 'height=500, width=700, top=180, left=180,fullscreen=no, scrollbars=yes, resizable=yes, menubar=yes, toolbar=yes, location=yes, directories=yes, status=yes');
      document.forms.val.value = "";
}
//-->
</script>
</head>
<body onload="call();">
<form name="forms">
 <input type="text" name="val" value="">
</form>
</body>
</html>


<###### HTML code for childwnd.html ######>
<html>
<head>
<script language="javascript">
<!--
function call_return() {
      var ls_text = document.frm_child.t1.value;
      self.opener.forms.val.value = ls_text
      self.close();
}
//-->
</script>
</head>
<body>
<form name ="frm_child">
<input type="text" name="t1" size="20">
<input type="button" value="OK" name="btn1" onClick ="call_return();">
</body>
</form>
</html>

Now when "main.html" is loaded at runtime, a popup window opens with a simple form on it as you require.

the user adds info and clicks OK.  the popup closes, and the input box on the parent window "main.html" receives the info from the pop up window form which you wanted...

hope your happy with my work?!

Sean

0
 
harveyballAuthor Commented:
Thanks for the code sean, but the other way of calling a function from the other form was the easier option but i do appreciate your help.
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 5
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now