[prog] JavaScript question: submitting a form to a new Window in IE 5.5

Fri Oct 7 04:45:51 EST 2005

On Thu, Oct 06, 2005 at 04:02:35PM +1000, Mary wrote:
> Problem: I have an HTML form I want to submit to a new window. ie, I
> want a user to click on the button and the result pops up in a new
> window. I also want to be able to specify the size of the new window, so
> I can't just use <form target="_top"> or anything like that.
> 
> Judging from Google, this is pretty much what everyone does:
> 
> <html>
> 
> <body>
> 
> <form action="" target="foo" onsubmit="window.open('', 'foo',
> 'width=450,height=300,status=yes')"> 
> <input name="q">
> <input type="submit"/>
> </form>
> 
> </body>
> 
> </html>
> 
> However, on IE 5.5 for Windows NT 4, which the site needs to support,
> this pops up *two* new windows: an empty one which is sized 450x300 and
> one with the result of the form, which is sized much larger. Is there a
> way to do this that works on IE 5.5?

I suspect the situation is as follows:

(a) submitting a form with target="foo" would normally open a new
window named "foo" when "foo" doesn't exist yet.

(b) explicitly opening a window with "window.open('', 'foo', ...)"
of course also opens a new window... :)

Now the issue is that "onsubmit=..." does not fundamentally alter
the regular submit behaviour, it just adds some other actions.
Also, dumb browsers[1] don't check whether a window with the same
name already exists when opening a new one with window.open()...
In a nutshell, you'll have to make sure the window "foo" already
exists _before_ the form is submitted. Theoretically, you have a race
condition here -- though, in practice, the actual submit-form action
will almost certainly take place before the window has been fully
created with window.open().  Unfortunately, that's just the wrong way
round for what you want.

To work around such problems, some browsers are clever enough to guess
what the programmer most likely meant -- but IE apparently isn't...

So what can you do?  As usual, TIMTOWTDI, but I'd suggest something
like:

<html>
<head>
  <script type="text/javascript">
  <!--
  function submit_form() {
    window.open('', 'foo', 'width=450,height=300,status=yes')
    document.myform.submit()
  }
  // -->
  </script>
</head>

<body>

<form name="myform" action="" target="foo">
<input name="q">
<button type="button" onclick="submit_form()">Submit</button>
</form>

</body>
</html>

This way you have detailed control over what will execute in what order
(i.e. the code within the function submit_form() ).  The regular submit
button of the form ("<input type="submit">") has to be replaced with a
generic button which calls your custom submit_form() when clicked. 

That should work even with IE (I currently don't have an IE 5.5 for
Windows NT 4 within reach, but IE 6.0 on W2k, for example, exhibits the
same behaviour -- and the suggested approach fixes it)

The added benefit of this approach is, btw, that you can now do the
submit from almost anywhere where you can squeeze in some javascript,
e.g. from client-side image maps, other frames, only after successful
checks, whatever... even automatically upon the window being closed.
The downside is, though, that javascripts needs to be enabled for this
to work, so you'll probably want to supply alternative code for those
users with javascript disabled (if that's an issue in your case).

Cheers,
Almut

[1] actually, I guess, what's supposed to happen in this particular
case most likely isn't specified anyway -- so take that "dumb" with a
grain of salt.

P.S.
<rant>
Having had the "pleasure" at work to have to write a few complex web
applications, I could add a whole rant here... but, not wanting to
sound too negative, I'll keep it short and only post the summary of it:

In case of doubt, always assume the worst -- and that's usually still
far too positive ;(   With web app development, the likelihood of
subtle problems is at least an order of magnitude higher than usual. 
Simple things are nice, but already with moderately complex
requirements I can only recommend to stay away from it, if you can...
It can really drive you nuts, I tell ya whut!
</rant>