Question

在击中目标动作之前，提交ID为frmClient的表单时，我必须显示弹出的局部视图。我有ajax调用，该调用返回了一个Model并已经编写了部分视图。我有以下ajax调用：

$("#frmClient").on("submit", function (event) {
        if ($("#ContactID").val() != '') {
            @*var obj = $('#formCreateContact').serialize();
            var jsonObj = @Html.Raw(Json.Encode(Model));*@
            $.ajax({
                url: "@Url.Action("GetClientMatch", "TestController")",
                data: {
                    Name: $("[name='Name']").val(),
                    Surname: $("[name='Surname']").val(),
                    Email: $("[name='Email']").val(),
                    MobileNumber: $("[name='MobileNumber']").val(),

                },
                dataType: "json",
                type: "POST",
                success: function (data, textStatus, jqXHR) {
                    alert(data);
                },
                error: function (jqXHR, statusText, errorText) {
                    alert('Error: ' + errorText)
                }
            });
        };
    });

以及控制器中的以下操作：

[HttpPost]
    public ActionResult GetClientMatch(ClientViewModel contactPerson)
    { 
        MatchesClientViewModel matchesClientViewModel = new MatchesClientViewModel();
        *some actions*
        return Json(new { data = matchesClientViewModel }, JsonRequestBehavior.AllowGet);
    }

ajax成功后，我需要返回部分View作为弹出窗口。我的部分看法如下：

@model Arcania.Business.BusinessModels.MatchesClientViewModel

<div class="dashboard-lead-creation">
    <div class="mdl-card custom-card custom-card--bordered mdl-shadow--2dp">
        <div class="mdl-card__supporting-text">
            @using (Html.BeginForm("SaveClient", "ClientController", FormMethod.Post))
            {
                @Html.AntiForgeryToken()
                string id = ViewBag.Id;
                <div>
                    <table class="mdl-data-table mdl-js-data-table" width="100%">
                        <thead>
                            <tr>
                                <th class="mdl-data-table__cell--non-numeric">
                                    @WebMVCStrings.Name
                                </th>
                                <th class="mdl-data-table__cell--non-numeric">
                                    @WebMVCStrings.Surname

                                </th>
                                <th class="mdl-data-table__cell--non-numeric">
                                    @WebMVCStrings.Email
                                </th>
                                <th class="mdl-data-table__cell--non-numeric">
                                    @WebMVCStrings.ContactNumber
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var item in Model.ClientMatches)
                            {
                                <tr>
                                    <td class="mdl-data-table__cell--non-numeric">
                                        @Html.DisplayFor(modelItem => item.Name)
                                    </td>
                                    <td class="mdl-data-table__cell--non-numeric">
                                        @Html.DisplayFor(modelItem => item.Surname)
                                    </td>
                                    <td class="mdl-data-table__cell--non-numeric">
                                        @Html.DisplayFor(modelItem => item.Email)
                                    </td>
                                    <td class="mdl-data-table__cell--non-numeric">
                                        @Html.DisplayFor(modelItem => item.phone)
                                    </td>
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>

                @Html.HiddenFor(m => m.privateClient.Surname, Model.privateClient.Surname)
                @Html.HiddenFor(m => m.privateClient.Name, Model.privateClient.Name)
                @Html.HiddenFor(m => m.privateClient.phone, Model.privateClient.phone)
                @Html.HiddenFor(m => m.privateClient.Email, Model.privateClient.Email)

                <button 
                    Submit
                </button>
            }
        </div>

    </div>
</div>

MatchesClientViewModel模型如下：

public class MatchesClientViewModel
{
    public List<PrivateClientBusinessModel> ClientMatches { get; set; }
    public PrivateClientBusinessModel privateClient { get; set; }
}

关于如何执行此操作的任何想法？

Answer 1

更改此行：

@using (Html.BeginForm("SaveClient", "ClientController", FormMethod.Post))

到

@using (Html.BeginForm(null, null, FormMethod.Post, new {id="//AN ID"}))

然后在javascript中具有如下功能：

$(function(){
     $("//form ID").submit(function(event){
         event.preventDefault();

         var data = $('//form ID').serialize();

         //Then do an ajax call to do what you want add then one to load a modal
     })
})

编辑：在将序列化表格发送给控制器时，在ajax调用中，删除：

contentType

在控制器方法中，参数将是您在此视图中使用的模型。

提交表单后，将部分视图显示为弹出

1 个答案: