将模型行动态添加到表中

Question

我现在已经阅读了很多文章，从 Phil Haacks 的“模型绑定到列表”到 Steve Sanderson 的“编辑可变长度列表”，现在我正在尝试解决我的问题 - 但是我无法真正让它工作.

我有两个模型 - 订单和文章。一个订单有很多文章。订单视图包含一个文章表。

目前，我正在使用我的订单视图模型中的 EditorFor(model => model.Articles) 创建第一个表格行。

它识别 Articles 是一个列表并返回正确的列表项。到目前为止，一切都很好。

现在我想要一个将文章添加到表行的链接，但通过向控制器使用 AJAX 请求，然后返回部分视图（仅包含文章表行）。我已经使用本教程完成了这项工作：http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/

但是，我的问题是我不知道如何在 ASP.NET MVC“样式”中继续文章行序列，以便在提交时得到识别。 （例如 Articles[1].Number Articles[2].Number 等）

这是我的代码。 “添加文章”链接应添加文章并向 /orders/BlankArticleRow 发送 ajax 请求

public ActionResult BlankArticleRow(int pos)
        {
            Article article = new Article()
            {
                Position = pos
            };

            return View(article);
        }

BlankArticleRow 的部分视图如下所示：

@model Bestellinterface.Models.Article

@{
    Layout = null;
}

@Html.EditorFor(model => model)

工作正常。当我单击“添加文章”链接时，该行被添加，但是文本字段等的属性没有正确的格式。我想要的是它继续对 html 元素进行编号，Articles[0].Number,Articles[1].Number,Articles[2].Number ...

EditorFor 有可能吗？有没有办法模拟一个列表，让它保持编号？

Answer 1

是的，您可以为此使用EditorFor：

    @{ int i = 0; }
@foreach (var article in Model.Articles)
{
@Html.EditorFor(model => Model.Articles[i])
i++;
}

假设编辑器模板包含 Title、Description 字段，我们最终会得到 Articles[i].Title、Articles[i].Description。

您的一个解决方案可能是返回一个包含订单所有文章的部分，这将确保您的索引是正确的。

或者，您可以使用 javascript 更新输入的索引。

为了在从动态表中删除项目时保持索引正确，我编写了以下内容：

//reset index values
$('#links-table tbody tr').each(function (index, value) {
    $(this).find('input[type=text]').prop('name', function (i, e) { return e.replace(/(\d+)/g, index) });
});

这会在每个输入的名称中查找索引，例如Articles[2].Title 并将其替换为新索引。您可能会在成功调用 ajax 时执行类似的操作。

希望有所帮助 本

Answer 2

我认为你错过了史蒂夫创建的扩展

如果你看这篇文章，它是这样使用的：

<% using(Html.BeginCollectionItem("gifts")) { %>
    Item: <%= Html.TextBoxFor(x => x.Name) %> 
    Value: $<%= Html.TextBoxFor(x => x.Price, new { size = 4 }) %> 
<% }