0

如何将我的简单 MVC4 待办事项列表应用程序转换为 AJAX？

理想的答案将为我提供将这个示例成功转换为 AJAX 的步骤。

注意：我不需要 AJAX 教程，而是了解 ASP.NET MVC 架构如何支持它。

附带问题：为什么@Html.EditorFor(model => model.TodoItemToCreate)即使视图模型设置为 ，也会带回输入的值this.TodoItemToCreate = null？

模型

public class TodosViewModel
{
    List<string> todoItems;
    public List<string> TodoItems
    { 
        get { return this.todoItems ?? (todoItems = new List<string>()); } 
    }

    [Display(Name="What do you need to do?")]
    public string TodoItemToCreate { get; set; }

    public bool AcceptTodoItem()
    {
        bool isThereAnItemToAccept = !string.IsNullOrWhiteSpace(this.TodoItemToCreate);

        if (isThereAnItemToAccept)
        {
            this.TodoItems.Add(this.TodoItemToCreate);
            this.TodoItemToCreate = null;
        }

        return isThereAnItemToAccept;
    }
}

控制器

public class TodosController : Controller
{
    public ActionResult Index()
    {
        return View(new TodosViewModel());
    }

    public ActionResult Create(TodosViewModel todosViewModel)
    {
        todosViewModel.AcceptTodoItem();
        return View("Index", todosViewModel);
    }
}

索引视图

@model Programming.LearnWeb.Models.TodosViewModel

@{
    ViewBag.Title = "Todos";
}

@using (Html.BeginForm("Create", "Todos"))
{
    @Html.Partial("List")    
    @Html.LabelFor(model => model.TodoItemToCreate)
    @Html.EditorFor(model => model.TodoItemToCreate)
    <input type="submit" value="Create" />
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

列表显示

@model Programming.LearnWeb.Models.TodosViewModel
    @{ int i = 0; }
<table>
    @foreach (var todoItem in Model.TodoItems)
    {
        <tr>
            <td>
                @Html.Hidden("TodoItems[" + i++ + "]", todoItem)
                @todoItem
            </td>
        </tr>
    }
</table>
4

1 回答 1

-1

我自己完成了这项工作 -如果有人感兴趣或有任何意见 ，结果在https://github.com/gabrielgreen/Todos.Mvc 。

我付出了相当多的努力，如果我做得对，我将不胜感激。

于 2012-12-07T09:16:54.590 回答