Ajax.BeginForm inside Html.BeginForm multiple submit button mvc

Question

I have nested form on my page.

@using (Html.BeginForm())
{
    @Html.TextBoxFor(model => model.ComapnyName, new { @class = "form-control", placeholder = @Resources.Customers.ComapnyName })
    @Html.ValidationMessageFor(model => model.PhoneNuComapnyNamember, "", new { @class = "text-danger" })
    // other stuff
    <button type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target=".modal-lg-customer-departments">
        <i class="fa fa-plus"></i> Add
    </button>
    //bootstrap modal
    @using (Ajax.BeginForm("CreateCustomersDepartments", "Customers", null, new AjaxOptions
    {
        HttpMethod = "Post",
        UpdateTargetId = "departmentsId",
        OnSuccess = "$('#departmentsModal').modal('hide')"
    }))
    {
        @Html.TextBoxFor(model => model.Name, new { @required = "require", @class = "form-control", placeholder = Resources.Common.Name })
        @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
        // other stuff
        //Create departments
        <input type="submit" value="@Resources.Common.Save" class="btn btn-success" name="CreateDepartments" />   
    }   
    //Create company
    <input type="submit" value="@Resources.Common.Save" class="btn btn-success" name="Create" />   
}

when I click submit button (Create for main form) require validator keep field from modal (depoartments add). I begin from add departments, and click submit button on modalpopup the main form keep the validator.

I tried to

How to have multiple submit buttons in your MVC forms

but page is not valid code does not come to controller. On the asp.net(web forms) I used validationGroup, how to get the same effect

Nested forms are invalid html and not supported. Move the inner modal form to after the main form — , Jan 22 '17 at 11:09
Its solvet my problem! The link who gave It is the correct approach for the few multi submit button? If there is a better solution? — 18666, Jan 22 '17 at 11:16
@18666 That link shows how to have multiple submit buttons not multiple nested forms. — CodingYoshi, Jan 22 '17 at 11:21
As @CodingYoshi has noted, you have misunderstood the code in the link. It does not use nested forms - it use the `action` attribute of the buttons to submit one form to different methods. — , Jan 22 '17 at 11:22

score 0 · Answer 1 · edited Jun 30 '23 at 19:18

Ajax.BeginForm renders as a <form> tag. That means your example would be nesting one form inside another one, which can't be done.

If you want to use multiple submit buttons on a single view, you can do like this:

<button type="submit" name="button1" id="button1" class="btn btn-success" 
        formaction = '@Url.Action("ActionMethod", "ConrollerName")'>View1</button>

<button type="submit" name="button2" id="button2" class="btn btn-success" 
        formaction = '@Url.Action("ActionMethod", "ConrollerName")'>View2</button>

This is just an example or a turnaround way to use different submit buttons on a single view to call different Controller/Action Methods by using the 'formaction' attribute.

Also you can use JSON requests with jQuery.

Take a look at this thread for more details on JSON request.

Hope this was helpful.

Ajax.BeginForm inside Html.BeginForm multiple submit button mvc

1 Answers1