Html.BeginForm inside of Html.BeginForm MVC3

Question

I have a main view that renders two partial views. The main view encompasses both of the partial views within a form. Each of the partial views also contain forms. All 3 views share the same viewmodel. What I want to do is encapsulate the data from all views with the main view, and run specific Controller action results with the partial views.

I want to know if this is even possible. When debugging I see that my content always posts to the HTTPPost of the Main views form. I have submit buttons for each of the forms accordingly. Sorry for the code post, its coming out all split up.

Main View:

@using (Html.BeginForm("Main", "Registration", FormMethod.Post, 
    new { @class="mainform" }))
{
    <form>
        <fieldset>
            <div id ="option1" class="conglomerate">
                @Html.Partial("_GetBusiness")
            </div> 
            <div id ="option2" class="dealership">
                @Html.Partial("_GetLocation")
            </div>
            <button type="submit" value="Create" class="buttonBlue" id="">
                <span>Create a new dealer</span>
            </button>
         </fieldset>
    </form>

Partial 1

@using (Html.BeginForm("CreateBusiness", "Business", FormMethod.Post, 
        new { @class="buisinessform" }))
{
    <form>
        <div class="editor-field">
            @Html.DropDownListFor(m =>m.BusinessId, new SelectList(Model.Businesses, 
                "BusinessId", "BusinessName"), "")
        </div>
        <label>Your company not listed? Register yours below:</label>
        <div class="editor-label">
            @Html.LabelFor(model => model.BusinessName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.BusinessName)
            @Html.ValidationMessageFor(model => model.BusinessName)
        </div>
        <button type="Button" value="" class="buttonBlue"id="TestSubmit">
           <span>Add Dealer</span>
        </button>
        <div class ="confirm">
            <button type="submit" value="Create" class="buttonBlue" id="">
                <span>Click here to confirm dealer addition</span>
            </button>
        </div>
    </form>
}

Erik Funkenbusch · Accepted Answer · 2013-02-20T00:40:28.850

7

As Dave mentions, It is not valid HTML to nest forms. It's not just HTML5, but any version of HTML.

It might work in some browsers, in certain circumstances, but it is never valid. And you can never depend on what will happen even if it does seem to work. Your best course of action is to use multiple non-nested forms on a page.

Can you explain why you think you need nested forms?

edited Feb 20 '13 at 00:40

answered Feb 20 '13 at 00:34

Erik Funkenbusch

92,674
28
195
291

Amen. Maybe a good additional question, can these partials have encapsulated forms rather than nested forms? – Dave Alperovich Feb 20 '13 at 02:26
Thanks both of you, i wasn't too aware of the concept. Yeah, theres got to be another way to do what i need. Which is to pass the ID values obtained from both of the partial views back to the view model. – WiseGuy Feb 20 '13 at 02:42
1

@BenjaminRandal - you can achieve that by simply posting all the data together as a single post. – Erik Funkenbusch Feb 20 '13 at 03:26
@BenjaminRandal, try either posting everything together and using selectively (as Mystere suggests) or breaking out multiple separate forms. – Dave Alperovich Feb 20 '13 at 14:02
I ended up splitting the submits into multiple separate forms, thanks for the input guys, wish I'd have learned that bit about html submission before the headache. Seemed like a good idea at the time :) – WiseGuy Mar 18 '13 at 19:52

score 5 · Answer 2 · edited Nov 16 '16 at 17:26

5

No, you cannot have nested forms. Sorry.

See HTML5 guidelines

"Flow content, but with no form element descendants"

edited Nov 16 '16 at 17:26

Stacked

6,892
7
57
73

answered Feb 19 '13 at 23:48

Dave Alperovich

32,320
8
79
101

Html.BeginForm inside of Html.BeginForm MVC3

2 Answers2

Linked