Question

我正在尝试在我的简单测试应用中使用ajax。我有一个下拉列表，一个按钮和一个div，我提供从下拉列表中选取的项目。这是代码：

我的控制器：

public ActionResult Index()
    {
        if (Session["items"] == null)
        {
            Session["items"] = new List<Item>();
        }

        var items = new Item[] { 
            new Item("1", "one"),
            new Item("2", "two"),
            new Item("3", "three")
        };

        ViewBag.list = Session["items"];
        ViewBag.items = new SelectList(items, "Id", "Value");
        return View(new Item());
    }

    [HttpPost]
    public ActionResult Index(Item item)
    {
        ((List<Item>)Session["items"]).Add(item);
        return RedirectToAction("Index");
    }

项目类：

public class Item
{
    private string id;
    private string value;

    public Item(string id, string value)
    {
        this.id = id;
        this.value = value;
    }

    public Item()
    {
    }

    public string Id { get { return id; } set { id = value; } }
    public string Value { get { return value; } set { this.value = value; } }
}

我的观点：

@model TestExample.Models.Item
@{
   ViewBag.Title = "Index";
 }
@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "itemList" }))
{
  <div id="btn">
    @Html.DropDownListFor(m => m.Id, ViewBag.items as SelectList)
    <input type="submit" value="Add" />
  </div>
}

<div id="itemList">
  @foreach (TestExample.Models.Item item in ViewBag.list as     List<TestExample.Models.Item>)
  {
    <h1>@item.Value</h1>
  }
</div>

问题在于，无论何时我从列表中选择项目并按添加，我都会得到我的投递箱和按钮复制以及div中显示的项目。这发生在第一次点击后，在它之后我总是看到两个下拉框和按钮，列表中的项目是重复的..这是什么原因？我该怎么办呢......

由于

Answer 1

在ajax发布后，您将相同的页面插入：

<div id="itemList">
  ...
</div>

这就是为什么你有2个按钮等等。在这个动作中：

[HttpPost]
public ActionResult Index(Item item) { ... }

您只需要使用列表项返回部分视图。

.net Razor ajax复制视图

1 个答案: