In my existing web page layout, which involves multiple files, one specifying the high-level layout, there are two elements, one for a left column, and one for a right column.
I want to have a single logical <form>
(with a single action) where <input>
elements are spread across both the left column and the right column. Is the only way to do this have the element be parent to both <div>
s (and refactor my layout code), or is it possible to do something like <form [something]>
inside both divs, so that clicking submit in one form submits all the inputs from both forms?
You can use multiple divs within a form, but you cannot close a parent before the child is closed. What are you attempting to accomplish? – Laurent S.
It is completely acceptable to use a DIV inside a <form> tag. If you look at the default CSS 2.1 stylesheet, div and p are both in the display: block category.
By default, if we have multiple div tags it will be displayed one below the other. In othere words, each div will be displayed in a separate line. To display multiple div tags in the same line, we can use the float property in CSS styles. The float property takes left, right,none(default value) and inherit as values.
I think people are missing the question. A <form>
can contain whatever elements it needs. If the layout of your page is something like:
<body>
<div id="leftColumn"><input name="foo" type="text"></div>
<div id="rightColumn"><input name="bar" type="text"></div>
<body>
You don't need separate foo
and bar
forms. You can happily encase both of those <div>
s inside a single <form>
element:
<body>
<form name="onlyOneForm">
<div id="leftColumn"><input name="foo" type="text"></div>
<div id="rightColumn"><input name="bar" type="text"></div>
</form>
<body>
The only way to submit both forms is to wrap both <div>
s within a single <form>
tag. Or, you can use jQuery/JavaScript to aggregate the data and submit them together as one submission.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With