从部分视图提交时无法获取序列化表单数据？

Question

有人可以帮我解决我做错的事情吗？ 我有一个部分视图，其中有客户详细信息。从父视图填充。现在我必须提交该表格。 但是当我要这样做时，它会提交但模型数据为空。表单数据无法序列化。

下面是我的部分视图代码：-

@model MobileBank.Models.CustomerDetails;

@{ 
    List<SelectListItem> list = ViewBag.Schemes;
    var str = string.Join(",",list.Where(p => ("," + Model.Schemes + ",").Contains("," + p.Text + ",")).OrderBy(i => Model.Schemes.Split(',').ToList().IndexOf(i.Text)).ToList().Select(s => s.Text));

}

<div class="box-body" style="margin-top: 2%;">
    @using (Html.BeginForm("CreatePIN", "RegisterCustomer", FormMethod.Post, new { id = "customerDetailForm" }))
    {
        Html.RenderPartial("_ShowMessages");
        @Html.AntiForgeryToken()
        @Html.ValidationSummary(true)
        <div class="row">
            <div class="col-xs-2">
                @Html.LabelFor(model => model.fincif)
            </div>
            <div class="col-xs-4">
                @*@Html.TextBoxFor(model => model.fincif, new { disabled = "disabled", @readonly = "readonly", id = "CIF" })*@
                @Html.EditorFor(model => model.fincif, new { htmlAttributes = new { @class = "form-control", disabled ="disabled", @readonly = "readonly", id = "CIF", style= "margin-bottom:8px;" } })
            </div>

            <div class="col-xs-2">
                @Html.LabelFor(model => model.Name)
            </div>
            <div class="col-xs-4">
                @*@Html.TextBoxFor(model => model.Name, new { id = "Name", disabled = "disabled", @readonly = "readonly" })*@
                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "Name" } })
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">
                @Html.LabelFor(model => model.DOB)
            </div>
            <div class="col-xs-4">
                @*@Html.TextBoxFor(model => model.DOB, new { id = "DOB", disabled = "disabled", @readonly = "readonly" })*@
                @Html.EditorFor(model => model.DOB, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "DOB" } })
            </div>

            <div class="col-xs-2">
                @Html.LabelFor(model => model.MobileNo)
            </div>
            <div class="col-xs-4">
                @*@Html.TextBoxFor(model => model.MobileNo, new { disabled = "disabled", @readonly = "readonly", id = "MobileNo" })*@
                @Html.EditorFor(model => model.MobileNo, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "MobileNo" } })
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">
                @Html.LabelFor(model => model.Address1)
            </div>
            <div class="col-xs-4">
                @*@Html.TextBoxFor(model => model.Address1, new { id = "Address1", disabled = "disabled", @readonly = "readonly" })*@
                @Html.EditorFor(model => model.Address1, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "Address1" } })
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2">
                @Html.LabelFor(model => model.Schemes)
            </div>
            <div class="col-xs-4">
                @if (Model.Schemes != null)
                {
                    @*@Html.TextBox("Schemes",str,new { disabled = "disabled", @readonly = "readonly", id = "Schemes" })*@
                    @Html.EditorFor(model => str, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "Schemes" } })

                }
                else
                {
                    @*@Html.TextBoxFor(model => model.Schemes, new { disabled = "disabled", @readonly = "readonly", id = "Schemes" })*@
                    @Html.EditorFor(model => model.Schemes, new { htmlAttributes = new { @class = "form-control", disabled = "disabled", @readonly = "readonly", id = "Schemes" } })
                }
            </div>
        </div>
        <div class="row divMargin">
            <div class="col-xs-offset-3 col-xs-6 text-center">
                <button type="submit" id="btnCreatePin" class="btn btn-primary" style="margin: 2%;">Create PIN</button>
                <input type="button" class="btn btn-default" onclick="javascript:return GoBack();" value="Cancel" />
            </div>
        </div>
    }
</div>


<script type="text/javascript">    
    $('form').submit(function (e) {
        debugger;
        e.preventDefault();
        if ($(this).valid()) {
            $.ajax({
                type: $(this).attr('method'), // GET or POST
                url: $(this).attr('action'),
                data: $(this).serialize(),
                success: function (response) {
                    //$('#customerData').html(response);
                    //$('#crtPIN').show();
                    HideWait();
                },
                error: function (jqXHR, exception) {
                    toastr.error('Error while processing your request');
                    HideWait();
                }
            });
        }
    });
</script>

我要向其发布表单数据的方法如下：-

[HttpPost]
[ValidateAntiForgeryToken]
[TypeFilter(typeof(Authorize))]
public async Task<ActionResult> CreatePassword(CustomerDetails model)
{
    try
    {
       //Work to do..
    }
    catch (Exception ex)
    {
        CatchError(ex);
    }
    return View();
}

在下图中，当我输入 cif 号码和手机号码并提交时，下面的列表是 fetch。这是局部视图中的形式。我需要在提交按钮单击时提交。但我没有得到任何数据

Answer 1

这是因为您的输入被禁用。启用它们或添加另一个未禁用的隐藏输入，具有相同的值，它将发送。

CIF 示例：

@Html.EditorFor(model => model.fincif, new { htmlAttributes = new { @class = "form-control", disabled ="disabled", @readonly = "readonly", id = "CIF", style= "margin-bottom:8px;" } })
@Html.HiddenFor(model => model.fincif)