asp.net mvc 4.0 ajax，重复的内容答案

【问题标题】：asp.net mvc 4.0 ajax, duplicated contentasp.net mvc 4.0 ajax，重复的内容
【发布时间】：2013-10-15 00:55:11
【问题描述】：

好的，首先我是 asp.net mvc 和 ajax 的新手。我想做的，真的很简单；

我有一个表格，显示登录用户可以参加的活动列表。列表中的每个元素都有一个 ajax.BeginForm() 指向将用户连接到事件的操作。

当用户连接到事件时，页面应该更新，以便在页面上正确显示参加者的数量。

所有，这工作正常。但是，更新页面时发生的情况是，我的 _Layout.cshtml 页面的全部内容都在我在“UpdateTargetId”中指定的“div id="tableevent"' 的副本中复制，以进行更新。

视图中的片段

<div id="tableevents">
    <table class="table table-striped table-bordered table-condensed">

//I DISPLAY TABLE ITEMS HERE.

           @using (Ajax.BeginForm("AddAttendantToEvent", "MadklubEvents", new AjaxOptions()
                    {
                        HttpMethod = "post",
                        UpdateTargetId = "tableevents"
                    }))
                    {          
                        @Html.Hidden("EventID", item.MadklubEventID);
                        <input type="submit" value="Join!" id="join" class="btn" />                             
                    }  


        </table>
    </div>

AddAttendantToEvent Action 这可能是我出错的地方。我过去只是通过普通提交表单将数据发布到此操作，没有 ajax。我在此操作中没有更改任何内容。

[HttpPost]
[Authorize]
public ActionResult AddAttendantToEvent(int EventID)
{

    if (ModelState.IsValid)
    {
        var uow = new RsvpUnitofWork();

        var currentUser = WebSecurity.CurrentUserName;
        var Event = uow.EventRepo.Find(EventID);
        var user = uow.UserRepo.All.SingleOrDefault(u => u.Profile.UserName.Equals(currentUser));
        user.Events.Add(Event);
        Event.Attendants.Add(user);
        uow.Save();
        return RedirectToAction("Index");
    }

    {
        return View();
    }

}

索引 重定向到的操作：这是视图模型（包含填充我的表的数据）的位置。

public ViewResult Index()
{
    ViewModelTest viewmodel = new ViewModelTest();
    viewmodel.events = madklubeventRepository.AllIncluding(madklubevent => madklubevent.Attendants).Take(10);
    viewmodel.users = kitchenuserRepository.All;

    return View(viewmodel);
}

为什么 div 被复制了，为什么我的主 _Layout 页面的整个内容都在标签的副本中被复制了？

请指点我正确的方向！ :)

【问题讨论】：

标签： jquery ajax asp.net-mvc asp.net-mvc-viewmodel

【解决方案1】：

您应该返回一个PartialView，其中只包含您希望在 div 中显示的 HTML。

  [HttpPost]
    [Authorize]
    public ActionResult AddAttendantToEvent(int EventID)
    {

        if (ModelState.IsValid)
        {
            var uow = new RsvpUnitofWork();

            var currentUser = WebSecurity.CurrentUserName;
            var Event = uow.EventRepo.Find(EventID);
            var user = uow.UserRepo.All.SingleOrDefault(u => u.Profile.UserName.Equals(currentUser));
            user.Events.Add(Event);
            Event.Attendants.Add(user);
            uow.Save();
            ViewModelTest viewmodel = new ViewModelTest();
            viewmodel.events = madklubeventRepository.AllIncluding(madklubevent =>  madklubevent.Attendants).Take(10);
    viewmodel.users = kitchenuserRepository.All;

            return PartialView("_Events", viewmodel)

        }

        {
            return View();
        }

    }

【讨论】：