C# 插入具有集合属性的视图

我有一个Person类和一个Contact类。 一个人可以有很多联系人

public class Person
{
    [Required]
    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string Notes { get; set; }

    [Required]
    public List<Contact> Contacts { get; set; }


    public Person()
    {
        Contacts = new List<Contact>();
    }
}


public class Contact
{
    [Required]
    public string Title { get; set; }

    [Required]
    public string Value { get; set; }

    public Contact() { Title = ""; Value = ""; }

    public Contact(string title, string value)
    {
        Title = title;
        Value = value;
    }
}

PersonCreateModel：

public class PersonController : Controller
{

    public ActionResult Create()
    {
        return View(new PersonCreateModel());
    }


    // POST: /Person/Create
    [HttpPost]
    public ActionResult Create(string btnSubmit, PersonCreateModel personModel)
    {
        try
        {
            switch (btnSubmit)
            {
                case "AddContact":
                    personModel.Person.Contacts.Add(new Contact(personModel.NewContact_Title, personModel.NewContact_Value));
                    personModel.NewContact_Title = personModel.NewContact_Value = "";
                    return View(personModel);

                case "CreatePerson"://Add To Database
                    //blabla
                    break;
            }

            return RedirectToAction("Index");
        }
        catch
        {
            return View(personModel);
        }
    }
}

public class PersonCreateModel
{

    public Person Person { get; set; }

    public string NewContact_Title { get; set; }
    public string NewContact_Value { get; set; }

    public PersonCreateModel()
    {
        Person = new Person();
    }
}

@model MvcApplication1.Models.PersonCreateModel

@{
    ViewBag.Title = "Create";

    var contactsGrid = new WebGrid(Model.Person.Contacts); 
}

<h2>Create</h2>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Person</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.FirstName)
            @Html.ValidationMessageFor(model => model.Person.FirstName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.LastName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.LastName)
            @Html.ValidationMessageFor(model => model.Person.LastName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.Notes)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.Notes)
            @Html.ValidationMessageFor(model => model.Person.Notes)
        </div>

        <br />
        <div>
            <h4>Contacts:</h4>

            <table>
                <tr>
                    <td>Title: @Html.EditorFor(model => model.NewContact_Title)</td>
                    <td>Value: @Html.EditorFor(model => model.NewContact_Value)</td>
                    <td>
                        <input type="submit" name="btnSubmit" value="AddContact" /></td>
                </tr>
            </table>

            <div>
                @contactsGrid.GetHtml()
            </div>
        </div>

        <p>
            <input type="submit" name="btnSubmit" value="CreatePerson" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

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

查看：

public class PersonController : Controller
{

    public ActionResult Create()
    {
        return View(new PersonCreateModel());
    }


    // POST: /Person/Create
    [HttpPost]
    public ActionResult Create(string btnSubmit, PersonCreateModel personModel)
    {
        try
        {
            switch (btnSubmit)
            {
                case "AddContact":
                    personModel.Person.Contacts.Add(new Contact(personModel.NewContact_Title, personModel.NewContact_Value));
                    personModel.NewContact_Title = personModel.NewContact_Value = "";
                    return View(personModel);

                case "CreatePerson"://Add To Database
                    //blabla
                    break;
            }

            return RedirectToAction("Index");
        }
        catch
        {
            return View(personModel);
        }
    }
}

public class PersonCreateModel
{

    public Person Person { get; set; }

    public string NewContact_Title { get; set; }
    public string NewContact_Value { get; set; }

    public PersonCreateModel()
    {
        Person = new Person();
    }
}

@model MvcApplication1.Models.PersonCreateModel

@{
    ViewBag.Title = "Create";

    var contactsGrid = new WebGrid(Model.Person.Contacts); 
}

<h2>Create</h2>

@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Person</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.FirstName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.FirstName)
            @Html.ValidationMessageFor(model => model.Person.FirstName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.LastName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.LastName)
            @Html.ValidationMessageFor(model => model.Person.LastName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Person.Notes)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Person.Notes)
            @Html.ValidationMessageFor(model => model.Person.Notes)
        </div>

        <br />
        <div>
            <h4>Contacts:</h4>

            <table>
                <tr>
                    <td>Title: @Html.EditorFor(model => model.NewContact_Title)</td>
                    <td>Value: @Html.EditorFor(model => model.NewContact_Value)</td>
                    <td>
                        <input type="submit" name="btnSubmit" value="AddContact" /></td>
                </tr>
            </table>

            <div>
                @contactsGrid.GetHtml()
            </div>
        </div>

        <p>
            <input type="submit" name="btnSubmit" value="CreatePerson" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

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

@model mvcapapplication1.Models.PersonCreateModel
@{
ViewBag.Title=“创建”；
var contactsGrid=新的WebGrid（Model.Person.Contacts）；
}
创造
@使用（Html.BeginForm（））
{
@Html.ValidationSummary（true）
人
@LabelFor（model=>model.Person.FirstName）
@EditorFor（model=>model.Person.FirstName）
@Html.ValidationMessageFor（model=>model.Person.FirstName）
@LabelFor（model=>model.Person.LastName）
@EditorFor（model=>model.Person.LastName）
@Html.ValidationMessageFor（model=>model.Person.LastName）
@LabelFor（model=>model.Person.Notes）
@EditorFor（model=>model.Person.Notes）
@Html.ValidationMessageFor（model=>model.Person.Notes）


联络：
标题：@Html.EditorFor（model=>model.NewContact_Title）
值：@Html.EditorFor（model=>model.NewContact\u值）
@contactsGrid.GetHtml（）


}
@ActionLink（“返回列表”、“索引”）
@节脚本{
@Scripts.Render（“~/bundles/jqueryval”）
}

我试图实现的是，用户可以在最后单击“创建”之前向此人添加多个联系人

我有两个问题：

1-这是最好的方法吗？有没有一种更简单/更简短的方法，比如使用javascript或jquery

2-当我第一次单击AddContact时效果很好，第二次单击Person.Contacts时是空的，而且我无法清除AddContact文本框

我在Stackoverflow上搜索了整个网络，但没有找到任何答案，有一个未回答的问题

---

PS：我是MVC新手，来自ASP.NET Webforms。

以我个人的观点，我认为更好的方法是在客户端处理联系人“添加”，如果您在服务器端没有对联系人的数据做任何“有用”的事（如保存到数据库或其他）

使用jQuery使用几行JavaScript，您可以为每个新联系人动态添加新的文本输入，当用户完成后，他可以点击submit，在一次调用中将所有信息发送到服务器

这种方法会更好，因为有两个原因，第一个原因是不会刷新页面来分散用户的注意力，第二个原因是可以避免用户多次调用服务器，这意味着根据您的流量可以节省100或1000次调用

编辑：

当然，您应该添加更多的功能和样式

要使其正常工作，视图模型应如下所示：

public class PersonCreateModel
{
    public Person Person { get; set; }
    public List<Contact> Contacts { get; set; }
}

公共类PersonCreateModel
{
公众人物{get；set；}
公共列表联系人{get；set；}
}

---

这是一个常见的问题，因此必须有很多其他的解决方案，看看它也有点“旧”，但概念仍然适用。

我编辑了这个问题以提供代码，并通过删除实体框架来简化它，这只是一个带有集合属性的普通类。很好，但是我不知道如何使用JS/JQ将项目添加到网格/集合中，以便能够在HTTPPost中阅读它，如果您能提供一个示例或链接，我将不胜感激，谢谢。当然，我会将其添加到我的回答中谢谢Marcos，很抱歉反应太晚，我目前无法测试，我会在我有能力时通知您。再次感谢！你知道如何使用webgrid吗？还有一个问题，无论我是使用webgrid还是手动循环Contacts集合并放置控件，在第二次回发时，集合再次为空。