同一页面中的多个部分视图，根据请求逐个打开，在提交时返回相同的模型

Question

我们正在使用MVC3开发应用程序。我们需要从主页面创建多个实体 - 如客户。相同的局部视图用于创建此实体。当点击链接/按钮时，这些部分视图将按需逐个加载到Jquery模型对话框（使用不同的div标签）。当我们创建第一个实体时，它会成功创建，并且相应的键将设置为主页面。但是当我们尝试创建第二个实体时，传递给控制器​​的数据与第一个实体相同，并且由于唯一键约束而抛出异常。我们尝试添加Modelstate.clear（），但没有成功。现在令人惊讶的是，如果我们通过以相反的顺序（即3,2,1）单击按钮来添加底部的实体，那么它就会被创建。任何人都可以解决这个问题吗？

用于部分查看加载和提交的

控制器

 public PartialViewResult _CustomerCreate()
    {
        CustomerViewModel customerviewmodel = new CustomerViewModel();
        ModelState.Clear();
        return PartialView(customerviewmodel);
    }
public ActionResult _CustomerCreate(CustomerViewModel customerviewmodel)
    {
        CustomerBL customerBL = new CustomerBL();
        ModelState.Clear();
        if (ModelState.IsValid)
        {
            string path = Request.UrlReferrer.AbsolutePath;
        }
        int id = customerBL.SaveData(customerviewmodel);
        string customer = Convert.ToString(customerviewmodel.FSTNAME + " " + customerviewmodel.MDLNAME + " " + customerviewmodel.LSTNAME);

        return Json(new { Customerid = id, CustomerName = customer });
    }

主页面上的示例脚本，它将部分视图加载到Jquery对话框

<script type="text/javascript">
$(function () {

    $(".divnewnominee").dialog({
        autoOpen: false, width: 800, height: 590, modal: true,
        buttons: {
            "Save": function () {
                 if ($("#CustomerFormID").validate().form()) {
                $.post("/Customer/_CustomerCreate",
                    $("#CustomerFormID").serialize(),
                    function (data) {
                        $("#NOMINAME").val(data.CustomerName);
                        $("#NOMINEE").val(data.Customerid);
                        $(".divnewnominee").dialog("close");

                    });
                   }
            },
            Cancel: function () { $(this).dialog("close"); }
        }
    });

    $(".newnominee").click(function () {

        $(".divnewnominee").html("")
            .dialog("option", "title", "New Customer")
            .load("/Customer/_CustomerCreate", function () { $(".divnewnominee").dialog("open"); });
    });

});

<script type="text/javascript">
$(function () {

    $(".divfamily").dialog({
        autoOpen: false, width: 800, height: 590, modal: true,
        buttons: {
            "Save": function () {
                 if ($("#CustomerFormID").validate().form()) {
                $.post("/Customer/_CustomerCreate",
                    $("#CustomerFormID").serialize(),
                    function (data) {
                        $("#DEPOSITCUST").val(data.CustomerName);
                        $("#DEPOSITBY").val(data.Customerid);
                        $(".divfamily").dialog("close");

                    });
                   }
            },
            Cancel: function () { $(this).dialog("close"); }
        }
    });

    $(".newfamily").click(function () {

        $(".divfamily").html("")
            .dialog("option", "title", "New Customer")
            .load("/Customer/_CustomerCreate", function () { $(".divfamily").dialog("open"); });
    });

});

加载到div中的部分视图

@model ccs.Models.ViewModels.CustomerViewModel

@{
ViewBag.Title = "Create";
}

<h2>Customer</h2>



<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

<script src="../../Scripts/ccsjs/ChooseFromList.js" type="text/javascript"> </script>

    

<script type="text/javascript">
$(function () {

    $("#dialog").dialog({
        autoOpen: false, width: 800, height: 500, modal: true,
        buttons: {
            "Save": function () {
                if ($("#AddressLookup").validate().form()) {
                    $.post("/Customer/AddressLookupCreate",
                    $("#AddressLookup").serialize(),
                    function (data) {
                        $("#CustAddress").val(data.address);
                        $("#AddrID").val(data.Adressid);
                        $("#dialog").dialog("close");

                    });
                }
            },
            Cancel: function () { $(this).dialog("close"); }
        }
    });

    $(".Address").click(function () {

        $("#dialog").html("")
            .dialog("option", "title", "Address")
            .load("/Customer/_AddressLookupCreate", function () { $("#dialog").dialog("open"); });
    });

});

<script type="text/javascript" >

$(function () {

    $("#addr").dialog({
        autoOpen: false, width: 800, height: 550, modal: true,
        buttons: {

            "Add": function () {
                if ($("#AddressLookupList").validate().form()) {
                    $.post("/Customer/_AddressLookupList",
                    $("#AddressLookupList").serialize(),
                    function (data) {
                        $("#CustAddress").val(data.address);
                        $("#AddrID").val(data.Adressid);
                        $("#addr").dialog("close");

                    });
                }
            },
            Cancel: function () { $(this).dialog("close"); }

        }
    });

    $(".searchaddr").click(function () {

        $("#addr").html("")
            .dialog("option", "title", "Address List")
            .load("/Customer/_AddressLookupList", function () { $("#addr").dialog("open"); });
    });
});

 <script type="text/javascript">
 $(function () {
     $("#divcust").dialog({
         autoOpen: false, width: 250, height: 500, modal: true
     });

     $("#custbtn").click(function () {
         $("#divcust").html("")
            .dialog("option", "title", "Customer List")
            .load("/Customer/_CustomerList", function () { $("#divcust").dialog("open"); });
     });
 });

@using (Html.BeginForm("_CustomerCreate", "Customer", FormMethod.Post, new { id="CustomerFormID" }))

{
 @Html.ValidationSummary(true)
<fieldset>
    <legend>Create</legend>
     <div style="float:left; width:100%;">
    <div class="row-style">
    <div class="labels">
        @Html.Label("Customer Code")
    </div>     


    <div id="Cust" class="fields">
       @Html.TextBoxFor(model => model.CUSTCODE)
        <div>@Html.ValidationMessageFor(model => model.CUSTCODE)</div>

    </div>

     <div class="labels">
        @Html.Label("First Name")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.FSTNAME)
        <div> @Html.ValidationMessageFor(model => model.FSTNAME)</div>

    </div>
    </div>
    <div class="row-style">
     <div class="labels">
        @Html.Label("Middle Name")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.MDLNAME)
        @Html.ValidationMessageFor(model => model.MDLNAME)
    </div>

    <div class="labels">
        @Html.Label("Last Name")
    </div>

     <div class="fields">
        @Html.EditorFor(model => model.LSTNAME)
        @Html.ValidationMessageFor(model => model.LSTNAME)
    </div>

    </div>
    <div class="row-style">
     <div class="labels">
        @Html.Label("Date of Birth")
    </div>


    <div class="fields">

        @Html.TextBoxFor(model => model.DOB, new { @class = "datePicker", id = "DOB", style = "width:170px;" })
        <div> @Html.ValidationMessageFor(model => model.DOB)</div>

    </div>

    <div class="labels">
        @Html.Label("Gender")
    </div>


     <div class="fields">
        @Html.DropDownListFor(model => model.Gender, new SelectList(Model.Gendr, "Key", "Value", " "), new { style = "width:205px;" }) 
        @Html.ValidationMessageFor(model => model.Gender)
    </div>
    </div>
    <div >
    <div class="labels">
       @Html.Label("Address ")
    </div>

    <div class="fields">
        @Html.TextAreaFor(model => model.ADDRESS, new { @name = "ADDRESS", @readonly = "readonly", style = "width:170px;height:50px;" ,id="CustAddress"})
                <img src="../../Content/themes/base/ccsimages/Search-icon.png" class="searchaddr" alt="Account Code" />
                <img src="../../Content/themes/base/ccsimages/New.jpg" alt="Account Code" class="Address" width="16Px" height="16Px"/>                   
               @* @Html.ActionLink("New Address", "AddressCreate")*@
        @Html.ValidationMessageFor(model => model.ADDRESS)
    </div>

    <div class="labels">
        @Html.Label("Photo ")
    </div>



    <div class="fields">            
     <p>
               <input type="file" id="PhotoUpload" name="PhotoUpload" />
    </p>    
    </div>              
     </div> 
    <div class="row-style"> 
    <div class="labels">
        @Html.Label("Pan No")
    </div>

     <div class="fields">
        @Html.EditorFor(model => model.ITPAN)
        <div>@Html.ValidationMessageFor(model => model.ITPAN)</div>

    </div>

    <div class="labels">
        @Html.Label("Tax Circle/Ward/District")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.WARD)
        @Html.ValidationMessageFor(model => model.WARD)
    </div>

    </div> 
    <div class="row-style">
     <div class="labels">
        @Html.Label("Mobile No")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.MOBILE)
        @*@Html.CheckBoxFor(model => model.SNDSMS, new { @value = Model.MOBILE, @onchange = "check(value)" })*@
        <div> @Html.ValidationMessageFor(model => model.MOBILE)</div>

    </div>

    <div class="labels">
        @Html.Label("Email ")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.EMAIL)
        @*@Html.CheckBoxFor(model => model.SNDMSG)*@
        <div> @Html.ValidationMessageFor(model => model.EMAIL)</div>

    </div>
       </div>       
    <div class="row-style">

    <div class="labels">
        @Html.Label("Phone No ")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.PHONE)
        <div> @Html.ValidationMessageFor(model => model.PHONE)</div>

    </div>

    <div class="labels">
        @Html.Label("Fax ")
    </div>

     <div class="fields">
        @Html.EditorFor(model => model.FAX)
        <div>@Html.ValidationMessageFor(model => model.FAX)</div>

    </div>
    </div>
    <div class="row-style">
     <div class="labels">
        @Html.Label("Family")
    </div>

     <div class="fields">
         @Html.DropDownListFor(model => model.FMLY, new SelectList(Model.Famly, "Key", "Value", " "), new { style = "width:205px;" }) 
        @Html.ValidationMessageFor(model => model.FMLY)
    </div>

    <div class="labels">
        @Html.Label("Customer Type")
    </div>

    <div class="fields">
       @Html.DropDownListFor(model => model.CUSTYPE, new SelectList(Model.CustTyp, "Key", "Value", " "), new { style = "width:205px;" }) 
        @Html.ValidationMessageFor(model => model.CUSTYPE)
    </div>
    </div>
    <div class="row-style">
    <div class="labels">
        @Html.Label("Repledge")
    </div>

     <div class="fields">
        @Html.DropDownListFor(model => model.REPLEDG, new SelectList(Model.Repldg, "Key", "Value", " "), new { style = "width:205px;" }) 
        @Html.ValidationMessageFor(model => model.REPLEDG)
    </div>

    <div class="labels">
        @Html.Label("ID Proof Type")
    </div>

     <div class="fields">
         @Html.DropDownListFor(model => model.IDPRTYPE, new SelectList(Model.IdProoflist, "IDPRCODE", "IDPRNAME", " "), new { style = "width:205px;" }) 
        @Html.ValidationMessageFor(model => model.IDPRTYPE)
    </div>
    </div>
    <div class="row-style">
    <div class="labels">
        @Html.Label("ID Proof No")
    </div>

    <div class="fields">
        @Html.EditorFor(model => model.IDPNO)
        @Html.ValidationMessageFor(model => model.IDPNO)
    </div>

    <div class="labels">
        @Html.Label("ID Proof ")
    </div>

    <div class="fields">            
     <p>
               <input type="file" id="IDProofUpload" name="IDProofUpload" />
    </p>       
    </div>
    </div>
   <div class="row-style">
    <div class="labels">
        @Html.Label("Father/Husband Name")
    </div>
   <div class="fields">
        @Html.TextBoxFor(model => model.FNAME, new { @name = "FNAME", @class = "FNAME", style = "width:170px;" })
        @*<img src="../../Content/themes/base/ccsimages/Search-icon.png" alt="Account Code" onclick="openCustPickerDialog(window, document.forms[0].FCUSTID,document.forms[0].FNAME, '/Customer/_CustomerLookupIndex/')"   />*@
        <img src="../../Content/themes/base/ccsimages/Search-icon.png" alt="Account Code" id="custbtn"/>
        @Html.ValidationMessageFor(model => model.FNAME)
        @Html.HiddenFor(model => model.FID)
    </div>
    </div>
    </div>
   @Html.HiddenFor(model => model.FCUSTID, new { @name = "FCUSTID",@class="FCUSTID", style = "width:130px;" })

    <div class="fields">
        @Html.HiddenFor(model => model.AVASRVCE)

    </div>
     <div class="fields">
        @Html.HiddenFor(model => model.ADDRID, new { @name = "ADDRID", style = "width:130px;",id="AddrID" })
        @Html.ValidationMessageFor(model => model.ADDRID)
    </div>

    @*<div id="NoteListBlock">@{Html.RenderPartial("_AddressLookupCreate");}</div>*@
    <div id="dialog" title="Address Lookup"></div>
    <div id="addr" title="Address"></div>
    <div id="divcust" title="Customer List"></div>
     <div class="row-style">
    <div class="errorfield">
     <div class="message"> @Html.ValidationMessageFor(model => model.CUSTCODE) @Html.ValidationMessageFor(model => model.FSTNAME) @Html.ValidationMessageFor(model => model.ADDRESS)</div>         
    </div>
    </div>
</fieldset>

}

提交First Div时，数据会正确保存。当第二个提交视图模型时，保留第一个div的值

Answer 1

我们解决了我们的问题。我们将单行代码添加到调用局部视图的Java脚本中。代码如下：

<script type="text/javascript">
$(function () {

    $(".divnewnominee").dialog({
        autoOpen: false, width: 800, height: 590, modal: true,
        buttons: {
            "Save": function () {
                 if ($("#CustomerFormID").validate().form()) {
                $.post("/Customer/_CustomerCreate",
                    $("#CustomerFormID").serialize(),
                    function (data) {
                        ***$(".divnewnominee").html(data);***
                        $("#NOMINAME").val(data.CustomerName);
                        $("#NOMINEE").val(data.Customerid);
                        $(".divnewnominee").dialog("close");

                    });
                   }
            },
            Cancel: function () { $(this).dialog("close"); }
        }
    });

    $(".newnominee").click(function () {

        $(".divnewnominee").html("")
            .dialog("option", "title", "New Customer")
            .load("/Customer/_CustomerCreate", function () { $(".divnewnominee").dialog("open"); });
    });

});