Javascript pop up with form submit to php

glow777tt · Feb 13, 2009

Hi I have a problem that has been bugging me for ages I need to launch a pop up window, the pop up has a form which when submitted closes the pop up window and Posts to a php page which overwrites the parent window.

I can get all the independant bits to work but not them all together.

heres the 3 files with all the testing taken out. Any help would be appreciated.

3 files start.html, form.html, result.php

---------------------------------
start.html (the first file that launches the pop up (form.html))

<HTML>
<HEAD>
<TITLE>Start Page</TITLE>

<SCRIPT LANGUAGE="JavaScript">

var newwin;
function launchwin(winurl,winname,winfeatures)
{
newwin = window.open(winurl,winname,winfeatures);

}
</SCRIPT>

</HEAD>

<BODY>

<FORM><INPUT TYPE="BUTTON" VALUE="Launch Form" ONCLICK="launchwin('form.html' , 'newwindow' , 'height=150,width=300')"></FORM>
</BODY>
</HTML>

-----------------------------------
form.html - the file that should POST to result.php, in the main frame and then close - this is where the problem is

<html>

<BODY>
<SCRIPT language="JavaScript">
function submitform()
{
document.theform.submit();
window.close();
}
</SCRIPT>

<form name="theform" action="result.php" method="post">
Enter your name: <input type="text" name="name" />
<A href="javascript: submitform()">Enter</A>
</form>

</body></html>

--------------------------------
result.php - file that echoes the data in the form in the parent window

<html><body>
Hello
<?php echo $_POST["name"]; ?>.<br />
</body></html>

vicvirk · Feb 13, 2009

in start.html, create a form that posts to result.php and hide it using css

Code:

<div style="display:none;">
<form action="result.php" id="frmResult" method="post">
<input type="text" id="name" name="name" value="" />
</form>
</div>

in your pop up window, write the value that is entered in the form back to the parent window's form,submit that and close the popup.

Code:

<html>

<BODY>
<SCRIPT language="JavaScript">
function submitform()
{
window.opener.document.getElementById("name").value = document.getElementById("name").value

window.opener.document.getElementById("frmResult").submit();
window.close();
}
</SCRIPT> 


Enter your name: <input type="text" id="name" name="name" />
<A href="javascript: submitform()">Enter</A>

</body></html>

^ for the above to work, be sure you have an "ID" attribute for your elements

TIP: trying googling the answer before posting, you'll find that more times than not someone else somewhere has had the same request and posted an answer online.

glow777tt · Feb 13, 2009

Thanks for that.
Is there a way of doing it without adding to start.html. I plan to have start.html as a control panel that launches quite a few pop up windows depending on user selection so feeding back the information would be complicated

Thanks again for your help

glow777tt · Feb 14, 2009

Scrub that last comment.
I can give the user the choice of pop up windows by adding more lines such as

<FORM><INPUT TYPE="BUTTON" VALUE="Launch Form" ONCLICK="launchwin('alternative-form.html' , 'newwindow' , 'height=150,width=300')"></FORM>

to start.html
but is there a way to add a second form on start so it displays a different results page (if that makes sense).
Or to have the form on start dynamic using PHP depending on which pop up was triggered?

Again thanks for the help

glow777tt · Feb 14, 2009

Sorted it now - by using a hidden field and PHP includes on the results page.

thankyou again

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Javascript pop up with form submit to php

glow777tt

Technical User

vicvirk

Programmer

glow777tt

Technical User

glow777tt

Technical User

glow777tt

Technical User

Similar threads

Part and Inventory Search

Sponsor