将html.beginform放入bootstrap模式中

I want to place an html.beginform inside a bootstrap modal which posts to a controller action method.

我想在引导模式中放置一个html.beginform,该模式发布到控制器动作方法。

The bootstrap modal comes up fine, but when I click on the "Save" button, it doesn't post to my method.

引导模式很好,但是当我点击“保存”按钮时,它不会发布到我的方法。

Notice I have the correct ViewModel name and the HttpPost method decorated on my controller Edit method.

注意我有我正确的ViewModel名称和我的控制器Edit方法上装饰的HttpPost方法。

Notice the below image showing what the link is in the lower left which seems to be a "GET" (see the "2" at the end of the link):

请注意下面的图像显示左下角的链接似乎是“GET”(请参阅​​链接末尾的“2”):

I got the following info from Fiddler after submitting the "Save" button.

提交“保存”按钮后,我从Fiddler获得了以下信息。

GET http://localhost:7683/__browserLink/requestData/c7214b476210499781860a178a6b7607?version=2 HTTP/1.1
X-Requested-With: XMLHttpRequest
Accept: application/json, text/javascript, */*; q=0.01
Referer: http://localhost:7683/Projects/Project/Edit/2?Name=A%26C+CaseTracker&Description=Keeps+track+of+all+dental+cases.&CustomerID=2&CategoryID=10&PriorityID=1&StatusID=4&Quote=509.00&Notes=Plus+maintenance+costs.
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko
Host: localhost:7683
DNT: 1
Connection: Keep-Alive

After placing a breakpoint on my "HTTPGET" method, that's where it's hitting even though in the form I'm telling it to do a POST:

在我的“HTTPGET”方法上放置一个断点之后,即使在我告诉它进行POST的表单中,它仍然会被击中:

@using (Html.BeginForm("Edit", "Project", FormMethod.Post))

Can someone please inform me what I'm doing wrong?

有人可以告诉我我做错了什么吗?

Here is my html:

@model YeagerTechDB.Models.Project

@{
    ViewBag.Title = "Edit Project";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Edit Project</h2>

<div class="modal" id="projectEditModal" tabindex="-1" role="dialog" aria-labelledby="projectModal-label" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="projectModal-label">Edit Project: Project: @Model.ProjectID</h4>
            </div>
            <div class="modal-body">
                @using (Html.BeginForm("Edit", "Project", FormMethod.Post))
                {
                   <div class="form-group">
                        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                        <div class="form-group">
                            @Html.LabelFor(model => model.Name, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control", @placeholder = "ProjectName" } })
                                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Description, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control", @placeholder = "Description" } })
                                @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Customer.Email, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.DropDownListFor(model => model.CustomerID, new SelectList(ViewBag.Customers, "CustomerID", "Email", Model.CustomerID), "-- Select Customer --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.CustomerID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Category.CategoryDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.CategoryID, new SelectList(ViewBag.Categories, "CategoryID", "CategoryDescription", Model.CategoryID), "-- Select Category --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.CategoryID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Priority.PriorityDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.PriorityID, new SelectList(ViewBag.Priorities, "PriorityID", "PriorityDescription", Model.PriorityID), "-- Select Priority --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.PriorityID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Status.StatusDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.StatusID, new SelectList(ViewBag.Statuses, "StatusID", "StatusDescription", Model.StatusID), "-- Select Status --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.StatusID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        @Html.LabelFor(model => model.Quote, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                        <div class="form-group">
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.EditorFor(model => model.Quote, new { htmlAttributes = new { @class = "form-control", @placeholder = "Quote" } })
                                @Html.ValidationMessageFor(model => model.Quote, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        @Html.LabelFor(model => model.Quote, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                        <div class="form-group">
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.EditorFor(model => model.Notes, new { htmlAttributes = new { @class = "form-control", @placeholder = "Notes" } })
                                @Html.ValidationMessageFor(model => model.Notes, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.CreatedDate, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                @Html.EditorFor(model => model.CreatedDate, new { htmlAttributes = new { @class = "form-control", @disabled = "disabled" } })
                            </div>
                            @Html.LabelFor(model => model.UpdatedDate, new { @class = "control-label col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                @Html.DisplayFor(model => model.UpdatedDate, new { htmlAttributes = new { @class = "form-control" } })
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <a href="#" class="btn" data-dismiss="modal">Close</a>
                        <button type="submit" class="btn btn-success" id="btnSaveProject">Save</button>
                    </div>
                }
            </div>
        </div>
    </div>
</div>

@section Scripts {
    <script>
        $(document).ready(function ()
        {
            $('#projectEditModal').modal('show');
        });
    </script>
}

Here is my Edit post method:

 [HttpPost]
               public async Task<ActionResult> Edit(Project project)
        {
            if (ModelState.IsValid)
            {
                //await db.EditProjectAsync(project);
            }

            List<CustomerDDL> customerList = await db.GetCustomerDDLAsync();
            ViewBag.Customers = customerList;

            List<Category> categoryList = await db.GetCategoriesAsync();
            ViewBag.Categories = categoryList;

            List<Priority> priorityList = await db.GetPrioritiesAsync();
            ViewBag.Priorities = priorityList;

            List<Status> statusList = await db.GetStatusesAsync();
            ViewBag.Statuses = statusList;

            return View(project);
        }

2 个解决方案

#1

You need to take out the data-dismiss="modal" from the div class="modal-footer". I had the same problem and that worked for me. Hope it does for you too.

你需要从div class =“modal-footer”中取出data-dismiss =“modal”。我有同样的问题,这对我有用。希望它也适合你。

#2

Try this

 <h2>Edit Project</h2>
 @using (Html.BeginForm("Edit", "Project", FormMethod.Post))
                {
<div class="modal" id="projectEditModal" tabindex="-1" role="dialog" aria-labelledby="projectModal-label" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="projectModal-label">Edit Project: Project: @Model.ProjectID</h4>
            </div>
            <div class="modal-body">

                   <div class="form-group">
                        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                        <div class="form-group">
                            @Html.LabelFor(model => model.Name, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
                                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control", @placeholder = "ProjectName" } })
                                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Description, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.EditorFor(model => model.Description, new { htmlAttributes = new { @class = "form-control", @placeholder = "Description" } })
                                @Html.ValidationMessageFor(model => model.Description, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Customer.Email, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.DropDownListFor(model => model.CustomerID, new SelectList(ViewBag.Customers, "CustomerID", "Email", Model.CustomerID), "-- Select Customer --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.CustomerID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Category.CategoryDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.CategoryID, new SelectList(ViewBag.Categories, "CategoryID", "CategoryDescription", Model.CategoryID), "-- Select Category --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.CategoryID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Priority.PriorityDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.PriorityID, new SelectList(ViewBag.Priorities, "PriorityID", "PriorityDescription", Model.PriorityID), "-- Select Priority --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.PriorityID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.Status.StatusDescription, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                @Html.DropDownListFor(model => model.StatusID, new SelectList(ViewBag.Statuses, "StatusID", "StatusDescription", Model.StatusID), "-- Select Status --", new { @class = "form-control" })
                                @Html.ValidationMessageFor(model => model.StatusID, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        @Html.LabelFor(model => model.Quote, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                        <div class="form-group">
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.EditorFor(model => model.Quote, new { htmlAttributes = new { @class = "form-control", @placeholder = "Quote" } })
                                @Html.ValidationMessageFor(model => model.Quote, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        @Html.LabelFor(model => model.Quote, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                        <div class="form-group">
                            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-9">
                                @Html.EditorFor(model => model.Notes, new { htmlAttributes = new { @class = "form-control", @placeholder = "Notes" } })
                                @Html.ValidationMessageFor(model => model.Notes, "", new { @class = "text-danger" })
                            </div>
                        </div>
                        <div class="form-group">
                            @Html.LabelFor(model => model.CreatedDate, new { @class = "control-label col-offset-1 col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                @Html.EditorFor(model => model.CreatedDate, new { htmlAttributes = new { @class = "form-control", @disabled = "disabled" } })
                            </div>
                            @Html.LabelFor(model => model.UpdatedDate, new { @class = "control-label col-lg-2 col-md-2 col-sm-2 col-xs-2" })
                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
                                @Html.DisplayFor(model => model.UpdatedDate, new { htmlAttributes = new { @class = "form-control" } })
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <a href="#" class="btn" data-dismiss="modal">Close</a>
                        <button type="submit" class="btn btn-success" id="btnSaveProject">Save</button>
                    </div>

            </div>
        </div>
    </div>
</div>
 }