如何在mvc4中将数据从部分视图传递到post action方法?

时间:2016-03-21 05:57:20

标签: c# jquery ajax asp.net-mvc-4

您好我有一个名为客户的视图。在该视图中,我有一个名为区域的字段。我在区域附近留了一个添加按钮。假设如果区域不在列表中,则意味着我单击该按钮将其打开 AreaPartialView 作为弹出窗口。

现在我有一个问题。也就是说数据没有从部分视图传递到控制器的post action方法。

我的模特

    public Nullable<System.Guid> AreaID { get; set; }
    public string Area { get; set; }
    public Nullable<System.Guid> CityID{ get; set; }
    public string  City { get; set; }

我的控制器

    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, "CityID", "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("Customer", JsonRequestBehavior.AllowGet);

 }

我的观点

   <div id="Area">
   <div class="col-sm-4">
   <div class="form-group">
   @Html.LabelFor(model => model.Area, new { @class = "control-label"})
   @Html.DropDownList("AreaID", null, "Select", new { @class = "form-control required" })
   <button id="AddArea">Area</button>
   <div id="AddAreaNew"></div>
            </div>
          </div>
       </div>

我的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() {
    var Area = $("#AreaName").val();
    var CityID = $("#CityID").val();
    alert(Area);
    var AreaAdd = {
        "AreaName": Area, "CityID": CityID
                };
    alert(AreaAdd.AreaName);
    alert(AreaAdd.CityID);

    $.post("/Customer/AddAreaInfo", AreaAdd,
    function (data) { if (data == 0) { location = location.href; } }, 'json').success(function (data) {

        alert("success");
        //window.close();
    });
 }
</script>

如果我点击添加按钮区域局部视图将作为弹出窗口打开,如果我输入详细信息并单击创建按钮,它将获取值并显示所有警报消息。但问题是它没有将Area值传递给post action方法,它传递City ID值,但它没有将 Area 值传递给post方法。 Area值将始终为null。

请任何人交叉检查我的代码并告诉我解决方案。

提前谢谢......

3 个答案:

答案 0 :(得分:0)

我不熟悉asp.net尝试此更改

 var AreaAdd = { Area: Area, CityID: CityID };

或使用FormCollection

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

      var ObjArea = new Area()
        {
            AreaID =objAreaID,
            DisplayName = objareaVM["AreaName"],
            PrintName = objareaVM["AreaName"],
            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("Customer", JsonRequestBehavior.AllowGet);

 }

答案 1 :(得分:0)

查看你的Model类,你有&#34; Area&#34;类属性的名称。

]

您正在使用&#34; AreaName&#34;发布区域,所以它不正确

public string Area { get; set; }

现在更改您的部分视图Jquery代码:

   var AreaAdd = {
    "AreaName": Area, "CityID": CityID
            };

答案 2 :(得分:0)

这将为您解决问题:

var AreaAdd = {Area:"your area", CityID:"your city id"};

实际上在mvc中,名称应该与模型属性的名称完全相同。