MVC5 Ajax.BeginForm,UpdateTargetId没有渲染PartialView

时间:2016-09-20 18:31:12

标签: ajax asp.net-mvc twitter-bootstrap

我的MVC应用程序出了问题。

我的控制器:

  public class CustomerController : Controller
{
    CustomerFacade cf = new CustomerFacade();

    public ActionResult Create()
    {
        return View();
    }

    [HttpPost]
    public void Create(Customers customers)
    {
        if (customers != null)
        {
            cf.CreateCustomer(customers, UserSession.UserId);
        }

        // return View();
    }


    public ActionResult GetAllCustomers()
    {
        var allCustomers = cf.GetAllCustomers();
        return PartialView("InsuranceCustomer", allCustomers);
    }
}

我的主要观点:

 <div class="x_content">

        <div id="mainb" style="height:350px;">

            <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">
                <i class="fa fa-plus"></i>
            </button>
            @*render modal*@
            @Html.Partial("~/Views/Customer/CreateModal.cshtml")

            <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">
                <i class="fa fa-database"></i>
            </button>
            @*render modal*@

            <div id="customerId">
                @Html.Action("GetAllCustomers", "Customer")
            </div>

        </div>
    </div>

部分视图CreateModal.cshtml是bootstrap modalpopup上的一个表单:

例如:

    <div class="modal-body">
            @using (Ajax.BeginForm("Create", "Customer", null, new AjaxOptions
            {
                HttpMethod = "Post",
                UpdateTargetId = "customerId",
                OnSuccess = "$('#customerModal').modal('hide')"
            }))
            {
                @Html.AntiForgeryToken()
                <div class="form-horizontal">
                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                    <div class="form-group">
                        <div class="col-md-4">
                            @Html.TextBoxFor(model => model.FirstName, new { @required = "require", @class = "form-control", placeholder = @Resources.InsuranceCustomer.FirstName })
                            @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
                        </div>
                        <div class="col-md-4">
                            @Html.TextBoxFor(model => model.LastName, new { @required = "require", @class = "form-control", placeholder = @Resources.InsuranceCustomer.LastName })
                            @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
                        </div>
                    </div>

                    // and other field form

                <div class="modal-footer">
                    <button type="submit" class="btn btn-default" data-dismiss="modal">Close</button>
                    <input type="submit" value="@Resources.Common.Save" class="btn btn-success" />
                </div>
            }
            @*<div>
                    @Html.ActionLink("Back to List", "Index")
                </div>*@
        </div>

和InsuranceCustomer看起来像:

@model IEnumerable<Insurance_System.Models.Customers>

  <p>
@Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>

    <th>
        @Html.DisplayNameFor(model => model.FirstName)
    </th>  
</tr>
@foreach (var item in Model) {
<tr>    
    <td>
        @Html.DisplayFor(modelItem => item.FirstName)
    </td>
</tr>}   

我想在提交模态CreateModal之后再次使用新元素加载InsuranceCustomer而不重新加载页面。

(抱歉我的英语不好)

1 个答案:

答案 0 :(得分:0)

控制器中的

    public ActionResult Create()
    {
        return View();
    }

    [HttpPost]
    public void Create(Customers customers)
    {
        var cust = new customer
        {
         name=customers.name,
         etc....
        }
        db.customers.add(cust);
        db.savechanges();
        var listcustomers  = db.customers.ToList();
        return PartialView("InsuranceCustomer",listcustomers);
    }

视图中的

<div class="x_content">

        <div id="mainb" style="height:350px;">
           <div id="customerId">
                      @*here will be load your partialview*@
            </div>
        </div>
    </div>
<div class="modal-body">
        @using (Ajax.BeginForm("Create", "Customer", null, new AjaxOptions
        {
            HttpMethod = "Post",
            UpdateTargetId = "customerId",
            OnSuccess = "$('#customerModal').modal('hide')"
        }))
        {
            @Html.AntiForgeryToken()
            <div class="form-horizontal">
                @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                <div class="form-group">
                    <div class="col-md-4">
                        @Html.TextBoxFor(model => model.FirstName, new { @required = "require", @class = "form-control", placeholder = @Resources.InsuranceCustomer.FirstName })
                        @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
                    </div>
                    <div class="col-md-4">
                        @Html.TextBoxFor(model => model.LastName, new { @required = "require", @class = "form-control", placeholder = @Resources.InsuranceCustomer.LastName })
                        @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
                    </div>
                </div>

                // and other field form

            <div class="modal-footer">
                <button type="submit" class="btn btn-default" data-dismiss="modal">Close</button>
                <input type="submit" value="@Resources.Common.Save" class="btn btn-success" />
            </div>
        }
        @*<div>
                @Html.ActionLink("Back to List", "Index")
            </div>*@
    </div>

部分视图中的

@model IEnumerable<Insurance_System.Models.Customers>

  <p>
@Html.ActionLink("Create New", "Create")
</p>
<table class="table">
<tr>

    <th>
        @Html.DisplayNameFor(model => model.FirstName)
    </th>  
</tr>
@foreach (var item in Model) {
<tr>    
    <td>
        @Html.DisplayFor(modelItem => item.FirstName)
    </td>
</tr>}