使用MVC3在View中设置List属性

时间:2012-06-20 01:44:58

标签: c# asp.net-mvc-3

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记录插入数据库,它就能正常工作。 我不知道如何起草我的视图以便它允许用户将联系人添加到记录中

2 个答案:

答案 0 :(得分: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;模板名称必须与类名匹配)。在屏幕截图下方找到放置编辑器模板的位置。

enter image description here

以下是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);
    }

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

enter image description here

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

enter image description here

答案 1 :(得分:0)

我这样做的方法是有两个单独的操作 - 一个执行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 }

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