c# – 在MVC4中多次单击按钮打开弹出窗口时出现问题？

嗨,这是我的父视图客户表单.如果我输入客户名称地址类型,街道,位置,地点,然后选择区域,我在区域附近有一个添加按钮.如果区域不在列表中则表示我必须添加.所以我点击该添加按钮,它将打开AreaPartial视图作为弹出窗口.

输入详细信息并单击“创建”按钮后,它将数据保存在数据库中,当它关闭时显示相同的弹出窗口,这意味着当我单击x标记[在弹出窗口的右上角时).现在一切正常.

现在我的问题是我打开弹出窗口,单击按钮并添加区域并关闭弹出窗口,然后单击父视图中的主保存按钮我必须再添加一个区域,所以我再次单击添加按钮但它不会打开弹出窗口.这是我的问题.

我的控制器代码用于保存在局部视图弹出窗口中输入的数据

public ActionResult AreaPartialView()
  {
    ViewBag.CityID = new SelectList(db.Cities,"CityID","DisplayName");
    return View("AreaPartialView");
  }
   [HttpPost]

  public ActionResult AddAreaInfo(CustomerViewModel objareaVM)
   {
     var objAreaID = Guid.NewGuid();
     ViewBag.CityID = new SelectList(db.Cities,"DisplayName",objareaVM.CityID);

     var ObjArea = new Area()
    {
    AreaID =objAreaID,DisplayName = objareaVM.Area,PrintName = objareaVM.Area,CityID = objareaVM.CityID,IsActive = true,IsDeleted = false,CreatedDate = DateTime.Now,EditedDate = DateTime.Now,LastActiveOn = DateTime.Now,RowID = Guid.NewGuid(),CreatedSessionID = Guid.NewGuid(),EditedSessionID = Guid.NewGuid(),OfflineMode = false,OfflineID = Guid.NewGuid()
    };

    db.Areas.Add(ObjArea);
    db.SaveChanges();
    ModelState.Clear();

  return Json(objAreaID);
   }

我的j-query代码在父视图中单击添加按钮后将区域局部视图显示为弹出窗口

<script src="~/Scripts/jquery-1.10.2-ui.js"></script>
  <link rel="stylesheet"href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />

  <script type="text/javascript">
   $("#AddArea").click(function () {
   $('#AddAreaNew').dialog("open");
   });
   $(function () {
   $('#AddAreaNew').dialog({
   autoOpen: false,width: 400,height: 500,resizable: false,title: 'Add Area',modal: true,open: function (event,ui) {
       $(this).load("@Url.Action("AreaPartialView","Customer")");
   },buttons: {
       "Close": function () {
           $(this).dialog("close");
       }
    }
    });
    });

我的部分视图代码

@Html.Label("Area",new { @class = "control-label" })
   @Html.TextBoxFor(model => model.Area,new { @class = "form-control",type = "text",id ="AreaName"})
   @Html.ValidationMessageFor(model => model.Area)

   @Html.Label("City")        
   @Html.DropDownList("CityID",null,"Select",new { @class = "form-control " })

 <script src="~/Scripts/jquery-1.10.4-ui.min.js"></script>
 <link href="~/Content/jquery-ui-1.10.4.custom.min.css" rel="stylesheet" />
 <script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>
 <script type="text/javascript">

  function SaveArea() {
  debugger;
  var Area = $("#AreaName").val();
  var CityID = $("#CityID").val();
  alert(Area);
  var AreaAdd = { "Area": '' +Area + '',"CityID": CityID };
   $.post("/Customer/AddAreaInfo",AreaAdd,function(data) { 
    var option = new Option(Area,data);
        $('#AreaID').append($(option));
        alert("sucess");
        window.close();
  });
  }

这是我的问题,我无法多次打开我的弹出窗口.我尽力解释我的问题.请任何人帮我解决这个问题.

提前谢谢..