8

Thanks to ASP.NET I get to learn the intracacies of getting away with <form> tags inside <form> tags. I set up what I thought was a simple DOM that isn't working:

<form id="Superform" action="javascript: return false;">
<form id="Subform1" action="javascript: return false;">
    form1
</form>
<form id="Subform2" action="javascript: return false;">
    form2
</form>
</form>

In this example, IE8 seems to work normally, but Chrome (18.0.1025.142 beta-m) seems to make Subform1 disappear. Does anyone know why? Is this a Chrome/webkit bug? I made a jsFiddle to test it - if you have other browsers handy, I'm curious of those results too.

Try the example at http://jsfiddle.net/weQmk/9/.

In IE8 I get:

Forms my browser sees: 
Superform
Subform1
Subform2

But in Chrome:

Forms my browser sees:
Superform
Subform2
Scott Stafford
  • 43,764
  • 28
  • 129
  • 177

1 Answers1

14

Forms cannot be nested in that way. On encounter of the closing </form> tag, the first open form is closed.

This is also illustrated in this fiddle: http://jsfiddle.net/weQmk/11/

Rob W
  • 341,306
  • 83
  • 791
  • 678
  • Okay (though this is quite irritating in ASP.NET-land, where your whole world is wrapped by a form) but it doesn't quite explain why Chrome makes one form disappear.. why doesn't it just close Superform and then write Subform? – Scott Stafford Mar 30 '12 at 17:23
  • See also: http://stackoverflow.com/questions/9433264/is-it-possible-to-wrap-html-form-elements-in-multiple-form-tags/9433497#9433497 – Rob W Mar 30 '12 at 17:23
  • 1
    I was wrong (original comment: "It seems to work nowadays (Chrome v42)."). It only seemed to work because I was wrapping my forms afterwards with another form. This at least works. And what also works: the form controls register themselves only to their parent form (i.e. it behaves as one would intuitively expect). – NicBright May 21 '15 at 08:05