C# MVC Razor创建要提交的对象列表

我是一名经验丰富的.NET C#软件开发人员，但就在几个月前，我开始使用MVC Razor（MVC 5）

我有一个小情况，我在网上找不到任何答案（经过几个小时的搜索）

我有一个模型，它有另一个模型的列表，而另一个模型也有一个模型列表，如下所示

public class Parent
{
    public string Name { get; set; }
    public string Sex { get; set; }
    public int Age { get; set; }
    public List<Child> Children { get; set; } 
}

public class Child
{
    public string Name { get; set; }
    public string Sex { get; set; }
    public int Age { get; set; }
    public List<GrandChild> GrandChildren { get; set; } 
}

public class GrandChild
{
    public string Name { get; set; }
    public string Sex { get; set; }
    public int Age { get; set; }
}

但是，在我的表单视图中，我找不到创建“添加”按钮并将新数据插入到子孙辈列表的方法（如果是子孙辈）

我只能为基本类型属性添加字段，但不能为对象添加字段

---

我真的很感激任何帮助

我认为您需要一个通用的标准

，您应该从HTML5中了解它。 如果我理解正确，您希望将数据从视图传递到控制器。现在，您应该需要创建表单中的按钮。 您需要/应该通过将模型数据从视图传递到控制器来调用控制器

@Html.ActionLink（）

是

表单中的类似内容可能会起到以下作用：

@Html.ActionLink("Click here to pass", "ActionName", new { ParameterNameOfTheController = Model })

这些东西背后的逻辑应该发生在控制器中。

---

我希望这能对您有所帮助。

我做了一个与您的场景相关的项目。然而，我找不到剃须刀的解决方案。所以我最终使用SheepIt jquery插件来动态添加字段

确保您坚持asp mvc理解的id和名称模式

---

为此，您可以使用Html.BeginCollectionItem

您可以做的是为主窗体创建一个视图，并将

Parent

模型传递给它，因为这将表示父窗体，然后您需要一行来表示子窗体，您可以将其称为

ChildRow.cshtml

    $("#addChild").on("click", function () {
        $.ajax({
            url: '@Url.Action("AddChild", "YourController")'
        }).success(function (partialView) {
            $('#children> tbody:last-child').append(partialView);
        });
    });

因此，对于父级，我们正在创建

Create.cshtml

视图，我们将传递父级模型

@model Parent

@using(Html.BeginForm())
{
   @Html.TextBoxFor(m => m.Name)


    <table id="children">
        <tbody>

<!-- This here will display the Child Row for existing Rows in the Parent model -->

            @foreach (var child in Model.Children )
            {
                @Html.Partial("ChildRow", child)
            }
        </tbody>

    </table>
<button  type="button" id="addChild">Add Child</button>

<button type="submit"> Save</button>
    }

现在，当单击按钮

addchild

时，您必须在表的末尾添加一行

为此，您将在控制器中创建一个新操作：

    public ActionResult AddChild()
    {
        return PartialView("Child", new Child());
    }

然后将这个jQuery添加到

Create.cshtml

    $("#addChild").on("click", function () {
        $.ajax({
            url: '@Url.Action("AddChild", "YourController")'
        }).success(function (partialView) {
            $('#children> tbody:last-child').append(partialView);
        });
    });

这将向表中追加一个新的子行

此外，如果还想删除同一页面上的行，则必须隐藏/禁用该行，为此，您可以添加以下jQuery：

$('body').on("click", '*[data-action="removeItem"]', function (e) {
    e.stopPropagation();
    var btn = $(this);
    var row = btn.closest('tr');
    var firstCell = $(row.find('td')[0]);
    var checkBox = firstCell.find('*[data-is-deleted]');
    var checkBoxVal = checkBox.val();

    if (checkBoxVal === 'False' || checkBox.val() === 'false') {
        checkBox.val('true');
        row.find('td').find('input, textarea, select').attr('readonly', 'readonly');
    } else {
        checkBox.val('false');
        row.find('td').find('input, textarea, select').attr("readonly", false);
    }

});

然后，当您发回控制器时，您将看到模型中的子对象列表

[HttpPost]
public ActionResult Create(Parent model)
{

   var newChildren = model.Children.Where(s => !s.IsDeleted && s.ChildId == 0);

   var updated = model.Children.Where(s => !s.IsDeleted && s.ChildId != 0);

   var deletedChildren = model.Children.Where(s => s.IsDeleted && s.ChildId != 0);


    return View(model);
}

---

您必须为孙辈们做类似的事情。

嗨H.Senkaya是的，我已经有了一个提交按钮，逻辑在控制器中，但是，我想知道如何创建新列表并从视图中向列表中添加项目，所以当我单击提交时，数据将在那里。Hi Vish J哦，我实际上找到了一个解决方案，使用纯javascript向列表中添加项目，并坚持使用mvc命名模式。但是如果你有大型复杂的嵌套对象，这将花费太多的时间。哇，这确实奏效了，谢谢你的例子。现在我对如何使用Html.BeginCollectionItem有了更好的理解。标记为答案：）未创建我的子类的新id，并将其与模型一起传递回。相反，它只是通过了0。有什么想法吗？@Callum最好在你的代码和模型中发布一个问题，然后将问题链接到评论中，以便有人回答look@SofteEng您似乎没有将此标记为答案。请参考答案并单击。请注意，不能对嵌套集合使用

BeginCollectionItem

。有关动态创建嵌套集合的工作示例，请参阅

$('body').on("click", '*[data-action="removeItem"]', function (e) {
    e.stopPropagation();
    var btn = $(this);
    var row = btn.closest('tr');
    var firstCell = $(row.find('td')[0]);
    var checkBox = firstCell.find('*[data-is-deleted]');
    var checkBoxVal = checkBox.val();

    if (checkBoxVal === 'False' || checkBox.val() === 'false') {
        checkBox.val('true');
        row.find('td').find('input, textarea, select').attr('readonly', 'readonly');
    } else {
        checkBox.val('false');
        row.find('td').find('input, textarea, select').attr("readonly", false);
    }

});

[HttpPost]
public ActionResult Create(Parent model)
{

   var newChildren = model.Children.Where(s => !s.IsDeleted && s.ChildId == 0);

   var updated = model.Children.Where(s => !s.IsDeleted && s.ChildId != 0);

   var deletedChildren = model.Children.Where(s => s.IsDeleted && s.ChildId != 0);


    return View(model);
}