create popup window with "on submit" form event

[Lysanne]

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]

<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]

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]

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]

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]

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]

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]

Thanks so much. That was indeed the solution.

:D