使用MVC3在View中设置List属性

Question

MVC之类的新手。我的课程看起来像这样：

public class SomeExampleModel
{
    public int Id { get; private set; }
    public string Name { get; private set;}
    public string Street { get; private set; }
    public IList<Contact> Contacts { get; private set; }
    ...
}

Contact的样子：

public class Contact
{
    public int Id { get; private set; }
    public int SomeExampleModelId { get; private set; }
    public ContactType Type { get; private set; }
    public string ContactValue { get; private set; }
...
}

现在的问题是，我有一个Post Create操作和Create.cshtml视图，用于向我的数据库添加新的SomeExampleModel。它适用于所有基本属性，但没有任何关于Contacts属性（它是数据库中的单独表）。

如何在我的视图中使用表单添加联系人（现在单身，将来是复数）？

编辑：如果我不清楚，我很抱歉。问题是没有正确地将数据保存在数据库中。我已经测试过了，如果我只是使用SomeExampleContext手动将SomeExampleModel记录插入数据库，它就能正常工作。 我不知道如何起草我的视图以便它允许用户将联系人添加到记录中

Answer 1

以下是使用EditorTemplate的一种方法。我对你的模型类做了一些小改动（这是有效的;但请注意，这只是为了你理解这个概念。你可以对此进行扩展）

模型

public class SomeExampleModel
{
    public int Id { get; set; }
    public string Name { get; set;}
    public string Street { get; set; }
    public IList<Contact> Contacts { get; set; }    
}

public class Contact
{
    public int Id { get; set; }
    public int SomeExampleModelId { get; set; }
    public ContactType Type { get; set; }
    public string ContactText { get { return Type.ToString(); } }
    public string ContactValue { get; set; }
}

public enum ContactType
{
    email,
    Phone,
    mobile,
    fax
}

请注意我已创建了一个返回枚举文本的属性ContactText（用于显示目的）

为Contact创建一个编辑器模板（名为Contact.cshtml;模板名称必须与类名匹配）。在屏幕截图下方找到放置编辑器模板的位置。

以下是Contact.cshtml

的代码

@model Test1.Models.Contact
<table>
@Html.HiddenFor(a=>a.Type)
<tr>
 <td>@Html.Label(Model.ContactText)</td>
 <td>@Html.TextBoxFor(a => a.ContactValue)</td>
</tr>
</table>

以下是“创建”视图的代码（在我的情况下为ExampleCreateView.cshtml）

@model Test1.Models.SomeExampleModel

@{
    ViewBag.Title = "ExampleCreateView";
}

<h2>ExampleCreateView</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>SomeExampleModel</legend>
        @Html.HiddenFor(model=>model.Id)
        <table>
            <tr>
                <td>@Html.LabelFor(model=>model.Name)</td>
                <td>@Html.EditorFor(model=>model.Name)</td>
            </tr>
            <tr>
                <td>@Html.LabelFor(model=>model.Street)</td>
                <td>@Html.EditorFor(model=>model.Street)</td>
            </tr>
            <tr>
                <td>@Html.LabelFor(model=>model.Contacts)</td>
                <td>@Html.EditorFor(model=>model.Contacts)</td>
            </tr>
        </table>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

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

记下我如何将@Html.EditorFor用于Contacts属性。

以下是Get，Post操作的显示方式

    public ActionResult ExampleCreateView()
    {
        SomeExampleModel model = new SomeExampleModel();
        Contact contactEmail = new Contact();
        contactEmail.Type = ContactType.email;

        Contact contactFax = new Contact();
        contactFax.Type = ContactType.fax;

        Contact contactPhone = new Contact();
        contactPhone.Type = ContactType.Phone;

        Contact contactMobile = new Contact();
        contactMobile.Type = ContactType.mobile;

        List<Contact> contacts = new List<Contact>();

        contacts.Add(contactEmail);
        contacts.Add(contactFax);
        contacts.Add(contactPhone);
        contacts.Add(contactMobile);

        model.Contacts = contacts;

        return View(model);
    }

    [HttpPost]
    public ActionResult ExampleCreateView(SomeExampleModel model)
    {
        //Your operations
        return View(model);
    }

运行该应用程序。这就是视图的样子

您将在POST操作中获得的内容的屏幕截图

Answer 2

我这样做的方法是有两个单独的操作 - 一个执行SomeExampleModel的初始创建，另一个操作用于向该模型添加Contact。

这样，您的创建SomeExampleModel视图就会拥有名称和街道，当它保存时，您将显示SomeExampleModel的只读版本。 SomeExampleModel的只读版本会列出名称和街道下方表格中的所有相关联系人，其中包含编辑和删除链接以及表格下的“添加新”联系人链接

e.g。

<table>
@foreach (var contact in Model.Contacts)
{
    <tr>
        <td>@contact.ContactType</td>
        <td>@contact.ContactValue</td>
        <td>@Html.Action("Edit", "Edit", "Contact",  new { id = contact.Id }</td>
        <td>@Html.Action("Delete", "Delete", "Contact", { id = contact.Id }</td>
    </tr>
}
</table>
@Html.Action("Add new contact", "Add", "Contact" new { id = Model.Id }

最初，没有列出任何联系人，之后你会有多个联系人。