<span id="goog_2075856540"></span><span id="goog_2075856541"></span><a href="/"></a>1. Why we don't allow nested forms in HTML5?<br><br>Problem is originally described at <a href="http://stackoverflow.com/questions/597596/how-do-you-overcome-the-html-form-nesting-limitation">http://stackoverflow.com/questions/597596/how-do-you-overcome-the-html-form-nesting-limitation</a><div>
<div><div><b>In short author says:</b><br><br>You are making a blog app and you have a form with some fields for creating a new post and a toolbar with "actions" like "Save", "Delete", "Cancel".<br>
Our objective is to write the form in a way that doesn't require javascript, just plain old html form and submit buttons.<br>Since the action url is defined in the Form tag and not in each individual submit button, our only option is to post to a generic url and then start "if...then...else" to determine the name of the button that was submitted. Not very elegant, but our only choice, since we don't want to rely on javascript.<br>
<br>The only problem is that pressing "Delete", will submit ALL the form fields on the server even though the only thing needed for this action is a Hidden input with the post-id. Not very big deal in this small example, but I have forms with hundreds (so to speak) of fields and tabs in my LOB applications that (because of requirements) have to submit everything in one-go and in any case this seems very inefficient and a waste. If form nesting was supported, I would at least be able to wrap the "Delete" submit button inside it's own form with only the post-id field.<br>
---</div><div><br></div><div><div>One answer was to re-design the app so users could delete items without opening them...</div><div>Another answer was to have the forms side by side on the page, but not nested. then use CSS to make all the buttons line up pretty. But... it is "<span class="Apple-style-span" style="font-family: Arial, 'Liberation Sans', 'DejaVu Sans', sans-serif; font-size: 13px; border-collapse: collapse; color: rgb(68, 68, 68); line-height: 17px; ">too hackish. Plus in a very large page ... it's almost impossible to completely separate the elements' screen position from their position in the document".</span></div>
<div><b>2. So, is there any elegant solution in HTML5, without JavaScript, and with several buttons to submit different sets of input fields (to the same or different URL(s)?</b></div><div><br></div></div></div></div>