0

我一直在做一些搜索,发现这个ASP.NET MVC 3 - Partial vs Display Template vs Editor Template但我仍然不清楚我应该为几个模型属性的“自定义 UI 控件”使用什么以及如何使用。

我有两个例子:

FistName MiddleInitial LastName 或电话分机

我想要某种我可以使用的可重复使用的 UI 控件/模板。

比如说,我有一个在创建和编辑视图中都使用的局部视图,称为 _ClientForm。在这个视图中,我的模型中有 Contact1 和 Contact2 以及相关属性。现在,我想为它们创建一个共同的外观并并排显示。此外,它们都具有 Phone/Ext 属性,我想要某种视觉控件,以便能够在我的模型中每次具有这两个属性时重新使用它。

我不清楚我应该使用什么以及我应该如何进行实施。

只是为了说明我的意思。

现在我有以下代码的部分视图

@using WebDemo.Helper
@model CardNumbers.Objects.Client
<fieldset>
    <legend>Client Info</legend>

    @Html.ValidationSummary(true)

    <input type="hidden" id="fntype" name="fntype">
    @Html.HiddenFor(model => model.Id)
    @Html.EditorFor(model => model.Number, EditorTemplate.TextBox)

    @Html.EditorFor(model => model.Name, EditorTemplate.TextBox)

    @Html.EditorFor(model => model.Address, EditorTemplate.EditBox)

    <div id="ContactsInfo">
        @*Contact 1*@
        <div id="Contact1">

            @Html.EditorFor(model => model.Contact1, EditorTemplate.TextBox)
            @Html.EditorFor(model => model.Email1, EditorTemplate.TextBox)
            @Html.EditorFor(model => model.Phone1, EditorTemplate.TextBox)
            @Html.EditorFor(model => model.Ext1, EditorTemplate.TextBox)

        </div>

        @*Contact2*@
        <div id="Contact2">

            @Html.EditorFor(model => model.Contact2, EditorTemplate.TextBox)

            @Html.EditorFor(model => model.Email2, EditorTemplate.TextBox)
            @Html.EditorFor(model => model.Phone2, EditorTemplate.TextBox)
            @Html.EditorFor(model => model.Ext2, EditorTemplate.TextBox)
        </div>
    </div>
    @*<div class="clear"></div>*@
    <div id="SaveCancel" class="float-right">
        <button type="Submit" id="btnSave">Save</button>
        <button type="reset" id="btnCancel">Cancel</button>
    </div>
</fieldset>

使用此处描述的技术http://dotnetspeak.com/index.php/2012/10/asp-net-mvc-template-and-knockout-js已经对视图代码进行了一些简化

因此,如您所见,我有 2 个带有联系信息的 div,在每个 div 中我也有电话/分机,我想彼此靠近放置。

所以,我想我需要一些可重复使用的东西:联系信息和电话/分机。

我还向我的 Client 类展示了一些进一步的说明:使用 System;

using System.ComponentModel.DataAnnotations;
using System.ComponentModel;

using DataAnnotationsExtensions;
using System.ComponentModel.DataAnnotations.Schema;
using System.Collections.Generic;

namespace CardNumbers.Objects
{
    public class Client
    {
        //public Client()
        //{
        //    this.ClientOrders = new List<ClientOrder>();

        //    this.Reorders = new List<Reorder>();
        //}

        [Key]
        [Column("ClientId",TypeName = "int")]
        public virtual int Id { get; set; }
        [Required]
        [DisplayName("Client No")]
        [Column("client_no", TypeName = "smallint")]
        public virtual Int16 Number { get; set; }

        [Required]
        [Column("client_name", TypeName = "varchar")]
        [DisplayName("Client Name")]
        [MaxLength(30, ErrorMessage = "Client Name should not be longer than 30 characters" )]
        [MinLength(3, ErrorMessage = "Client Name is too short")]
        public virtual string Name { get; set; }

        [StringLength(100)]
        [DisplayName("First Contact")]
        [DisplayFormat(NullDisplayText = "")]
        [Column("Contact1",TypeName =  "varchar")]
        public virtual string Contact1 { get; set; }

        [Email]
        [StringLength(100)]
        [Column("c1_email", TypeName = "varchar")]
        public virtual string Email1 { get; set; }

        [DataType(DataType.PhoneNumber)]
        [Column("C1_Phone", TypeName = "varchar")]
        [StringLength(10)]
        [DisplayName("Phone")]
        public virtual string Phone1 { get; set; }

        [StringLength(5)]
        [Column("C1_Ext", TypeName = "varchar")]
        [DisplayName("Ext")]
        public virtual string Ext1 { get; set; }

        [StringLength(100)]
        [DisplayName("Second Contact")]
        [Column("Contact2", TypeName = "varchar")]
        public virtual string Contact2 { get; set; }

        [Email]
        [StringLength(100)]
        [Column("C2_Email", TypeName = "varchar")]
        public virtual string Email2 { get; set; }

        [DataType(DataType.PhoneNumber)]
        [StringLength(10)]
        [DisplayName("Phone")]
        [Column("C2_Phone", TypeName = "varchar")]
        public virtual string Phone2 { get; set; }

        [StringLength(5)]
        [DisplayName("Ext")]
        [Column("C2_Ext",TypeName = "varchar")]
        public virtual string Ext2 { get; set; }

        [DataType(DataType.MultilineText)]
        public virtual string Address { get; set; }

        [ForeignKey("EnteredByOperator")]
        public string EnteredBy { get; set; }

        [InverseProperty("ClientsEnteredBy")]
        public virtual Operator EnteredByOperator { get; set; }

        [ForeignKey("ModifiedByOperator")]
        public string ModifiedBy { get; set; }

        [InverseProperty("ClientsUpdatedBy")]
        public virtual Operator ModifiedByOperator { get; set; }

        [DataType(DataType.DateTime)]
        [DisplayName("Created on")]
        public DateTime EnteredOn { get; set; }

        [DataType(DataType.DateTime)]
        [DisplayName("Modified on")]
        public DateTime? ModifiedOn { get; set; }

        public virtual ICollection<ClientOrder> ClientOrders { get; set; }

        public virtual ICollection<Reorder> Reorders { get; set; }
    }
}`

`

提前非常感谢。

4

1 回答 1

1

我会添加 2 个 EditorFor 模板。

  • 编辑个人联系信息的一种
  • 一个用于联系信息列表或用于包含两个联系信息的特殊视图模型。该模板将依次调用所有包含的联系人信息视图模型的编辑器,这些模型将呈现第一个模板。

视图模型

 public class ContactDetails
 {
    public string Name {get;set;]
    public string Email {get; set;}
 }
 public class ContactsInfo
 {
    public ContactDetails Contact1 {get; set; }
    public ContactDetails Contact2 {get; set; }
 }
 public class Client {
    public ContactsInfo ContactsInfo {get; set;}
 }

主视图

 @model client
 ...other html....
 @Html.EditorFor(m => m.ContactsInfo)
 ...other html....

编辑器模板 ContactsInfo.cshtml

@model ContactsInfo
<div id="ContactsInfo">
    <div id="Contact1">
        @Html.EditorFor(m => m.Contact1)
    </div>
    <div id="Contact2">
        @Html.EditorFor(m => m.Contact2)
    </div>
</div> 

编辑器模板 ContactDetails.cshtml

   @model ContactDetails
   @Html.EditorFor(model => model.Contact1, EditorTemplate.TextBox)
   @Html.EditorFor(model => model.Email1, EditorTemplate.TextBox)
   @Html.EditorFor(model => model.Phone1, EditorTemplate.TextBox)
   @Html.EditorFor(model => model.Ext1, EditorTemplate.TextBox)
于 2012-10-18T18:07:05.333 回答