Click to See Complete Forum and Search --> : create popup window with "on submit" form event


Lysanne
08-16-2003, 05:14 PM
Hello,

I know there's already a lot of stuff about popup windows and forms, but nothing is quite answering my question, so here I go...

I need to create a popup window using the "on submit" event, because I do not want to use the traditionnal submit button. My code ALMOST works, but the window that opens is a traditional window, not a popup with the parameters I need. Here's my code:

for the "form" tag:

<form action="recap5_r.htm" target="fenver" method="post" name="form_recap_5" id="form_recap_5" onSubmit="window.open('recap5_r.htm', 'fenver', 'scrollbars=yes,resizable=yes,width=420,height=600'); return false;">

for the image being used as the "submit" button:


<a href="javascript:document.form_recap_5.submit()" onmouseover="document.form_recap_5.sub_but.src='images/bt_ver_o.gif'" onmouseout="document.form_recap_5.sub_but.src='images/bt_ver.gif'"><img src="images/bt_ver.gif" name="sub_but" width="129" height="38" border="0" id="sub_but"></a>

I can't think of any other way. Can anyone help?
:confused:

Thanks,
Lysanne

Charles
08-16-2003, 05:38 PM
<form action="recap5_r.htm" target="fenver" method="post" name="form_recap_5" id="form_recap_5" onsubmit="window.open('recap5_r.htm', 'fenver', 'scrollbars,resizable,width=420,height=600')">

<input type="image" src="images/bt_ver.gif" alt="Submit" name="sub_but" width="129" height="38" border="0" id="sub_but" onmouseover="document.form_recap_5.sub_but.src='images/bt_ver_o.gif'" onmouseout="document.form_recap_5.sub_but.src='images/bt_ver.gif'">

</form>

Khalid Ali
08-16-2003, 05:46 PM
Originally posted by Charles
<form a.... name="form_recap_5" id="form_recap_5" ....

try using forms with the id attribute and just skip the name attribute.( it will be deprericated in near future)

Lysanne
08-16-2003, 06:07 PM
Hi Charles,

Thanks for the answer, but it doesn't seem to work. I get an error message, and I don't understand how the form understands that this image IS the submit button. Am I supposed to keep the <a href="javascript:document.form_recap_5.submit()"> around the <input type="image"> label?

:confused:

Charles
08-16-2003, 07:41 PM
An INPUT element of type "image" is a submit button. (http://www.w3.org/TR/html4/interact/forms.html#h-17.4.1)

Please post a URL and describe the error that you are getting.

And note, the "onsubmit" handler is called just before the form is submitted but not if the form is submitted using JavaScript.

Lysanne
08-16-2003, 08:09 PM
Oups!

Sorry, I didn't know about the input type image being a submit button.

I realized that part of the problem was that my server did not allow POST (don't ask... it's just a test server), so I put get and the popup works fine. The error is actually with the mouseover of the button-image. The status bar just says "error on page"

Here's the URL:
http://www.unites.uqam.ca/ppm/saaq/cours1/module5/recap5_test_js.htm

I really appreciate this. Boy do I have a lot to learn..

Hoping to become :cool:

Charles
08-16-2003, 08:14 PM
I wrote that in haste and I think that you might do better by substituting document.form_recap_5.sub_but.src with this.src in the "onmouseover" and "onmouseout" handlers.

Lysanne
08-16-2003, 08:27 PM
Thanks so much. That was indeed the solution.

:D