4

我正在学习 MVC3 并构建一个小的“待办事项”网站作为学习练习,所以我对我完全走错路的想法持开放态度!

无论如何,我有一个与常规回发完美配合的页面。我正在尝试使用 jQuery 和 UnobtrusiveAjax 对其进行 Ajax 处理,并且一切在技术上仍然正常工作(数据被传递到控制器并保存在我的数据库中)。问题是在我替换的元素中,每个表单的字段都填充了我刚刚在一个表单上传递的值。

索引.cshtml

@model WebUI.Models.HomeViewModel

@{
    ViewBag.Title = "Index";
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
}

<h2>My Goals</h2>
...snip...
<div id="goal_div">
@foreach (var goal in Model.Goals)
{
    Html.RenderPartial("GoalDetail", goal);
}
</div>

目标细节.cshtml

@model Domain.Entities.Goal
<div class="goal" id='goal_id@(Model.ID)'>
    <h4>@Model.Name</h4>
    <p>@DateTime.Now.ToString()</p>
    <p class="goal_description">@Model.Progress % complete</p>
    <ul>
        @foreach (var task in Model.Tasks)
        {
            using (Ajax.BeginForm("UpdateTask", "Home", new AjaxOptions { UpdateTargetId = "goal_id" + Model.ID }))
            {
                @Html.HiddenFor(g => g.ID)
                @Html.Hidden("TaskID", task.ID)
                <li class="task">
                    @Html.CheckBox("IsComplete", task.IsComplete) 
                    @Html.TextBox("TaskName", task.Name)
                    @task.Name
                    <input class="actionButtons" type="submit" value="Update task" />
                </li>
            }
        }
        <li>
        @using (Html.BeginForm("AddTask", "Home"))
        {
            @Html.HiddenFor(g => g.ID)
            @Html.Editor("TaskName")
            <input class="actionButtons" type="submit" value="Add task" />
        }
        </li>
    </ul>
</div>

家庭控制器.cs

public class HomeController : Controller
{
    private IGoalRepository Repository;

    public HomeController(IGoalRepository repo)
    {
        Repository = repo;
    }

    public ViewResult Index()
    {
        HomeViewModel viewModel = new HomeViewModel();
        viewModel.Goals = Repository.Goals;
        return View(viewModel);
    }

    public ActionResult AddTask(int ID, string TaskName)
    {
        bool success = Repository.SaveTask(ID, 0, TaskName, DateTime.Today, false);
        return RedirectToAction("Index");
    }

    public ActionResult UpdateTask(int ID, int TaskID, bool IsComplete, string TaskName)
    {
        bool success = Repository.SaveTask(ID, TaskID, TaskName, DateTime.Today, IsComplete);
        Goal updatedGoal = Repository.Goals.FirstOrDefault(g => g.ID == ID);
        return PartialView("GoalDetail", updatedGoal);
    }

    public ActionResult AddGoal(string Name, DateTime Enddate)
    {
        bool success = Repository.SaveGoal(0, Name, DateTime.Today, Enddate);
        return RedirectToAction("Index");
    }

    public ActionResult UpdateGoal(int GoalID, string Name, DateTime Enddate)
    {
        bool success = Repository.SaveGoal(GoalID, Name, DateTime.Today, Enddate);
        return RedirectToAction("Index");
    }
}

我有时间只是为了确保 AJAX 刷新确实发生了,你会明白为什么我有两次任务名称。

这是我第一次加载页面时看到的: 前

然后我选中第一个目标的第二个任务的复选框,将其重命名为“更新任务#2”,然后单击更新按钮。这就是发生这种情况的时候: 后

看到不属于表单的任务名称都是正确的(暂时忽略重新排序),并且进度值已正确更新(它只需要完成的任务并除以任务总数),我有不知道为什么所有的表单值都被替换了。甚至 AddTask 表单也已填写,尽管我还没有更改该表单以使用 Ajax。这两天我一直在寻找原因,结果一无所获。

4

1 回答 1

2

After even more searching, I finally discovered the issue. Basically, it has to do with the way ModelState works in MVC. Reading this help thread and this article really helped me understand what was happening with my page. I ended up calling ModelState.Clear() in my controller right before returning the partial view, but this SO question and answer suggests another method.

于 2012-06-06T13:37:27.857 回答