AspNet MVC4 教学-23:Asp.Net MVC4 Display And Editor 模板技术高速应用Demo

A.创建Basic类型的项目.

B.在Model文件夹下,创建3个文件:

Role.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcEditorTemplatesTest.Models
{
    public enum Role
    {
        Admin, User, Guest
    }
}

Teacher.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcEditorTemplatesTest.Models
{
    public class Teacher
    {
        public string TeacherId
        {
            get
            {
                return "8888";
            }
        }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public Role Role
        {
            get
            {
                return Role.Guest;
            }
            set
            {
                ;
            }

        }
    }

}

Student.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcEditorTemplatesTest.Models
{
    public class Student
    {
        public int StudentId
        {
            get
            {
                return 88;
            }
            set
            {
                ;
            }
        }
        public string Remark
        {
            get
            {
                return "航大学生.";
            }
            set
            {
                ;
            }
        }
        public Role Role {
            get
            {
                return Role.User;
            }
            set
            {
                ;
            }

        }
    }
}

C.创建HomeControlller.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcEditorTemplatesTest.Models;

namespace MvcEditorTemplatesTest.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View(new Teacher());
        }
        public ActionResult Student()
        {
            return View(new Student());
        }
        public ActionResult StudentDetails()
        {
            return View(new Student());
        }
        public ActionResult TeacherDetails()
        {
            return View(new Teacher());
        }
    }
}

D.创建View:

在Shared以下创建目录:EditorTemplates,然后在当中再创建两个文件:

Role.cshtml:

@model MvcEditorTemplatesTest.Models.Role
<div id="MyDDL">
@Html.DropDownListFor(m => m, new SelectList(Enum.GetNames(Model.GetType()), "Guest"))
</div>

String.cshtml:

@model System.String
@Html.TextBox("", "比文字来自String编辑模板", new { style = "background:blue;width:220px" })

在Shared以下创建目录:DisplayTemplates,然后在当中再创建两个文件:

Role.cshtml:

@model MvcEditorTemplatesTest.Models.Role
<div id="MyDDL">
@Enum.GetName(Model.GetType(),Model)
</div>

String.cshtml:

@model System.String
@Html.LabelFor(m=>m,Model,new { style = "background:red;width:220px" })

在Home以下创建4个文件:

Index.cshtml:

@model MvcEditorTemplatesTest.Models.Teacher

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

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

    <fieldset>
        <legend>Teacher</legend>

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

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

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

            <div class="editor-label">
            @Html.LabelFor(model => model.Role,"下面界面来自Role模板")
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Role)
            @Html.ValidationMessageFor(model => model.Role)
        </div>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}
 <p>
           @Html.ActionLink("Go to get Teacher Details", "TeacherDetails")
        </p>
        <p>
           @Html.ActionLink("Go to Create Student","Student")
        </p>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Student.cshtml:

@model MvcEditorTemplatesTest.Models.Student

@{
    ViewBag.Title = "Student";
}

<h2>Student</h2>

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

    <fieldset>
        <legend>Student</legend>

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

        <div class="editor-label">
            @Html.LabelFor(model => model.Remark)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Remark)
            @Html.ValidationMessageFor(model => model.Remark)
        </div>
            <div class="editor-label">
            @Html.LabelFor(model => model.Role,"下面界面来自Role模板")
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Role)
            @Html.ValidationMessageFor(model => model.Role)
        </div>
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}
       <p>@Html.ActionLink("Go to get Student Details", "StudentDetails")</p>
        <p>
           @Html.ActionLink("Go to Create Teacher","Index")
        </p>
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

StudentDetails.cshtml:

@model MvcEditorTemplatesTest.Models.Student

@{
    ViewBag.Title = "StudentDetails";
}
<h2>StudentDetails</h2>
<fieldset>
    <legend>Student</legend>
    <div class="display-label">
        @Html.LabelFor(model => model.StudentId)
    </div>
    <div class="display-field">
      @Html.DisplayTextFor(model => model.StudentId)
    </div>
     <div class="display-label">
         @Html.DisplayNameFor(model => model.Remark)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.Remark)
    </div>
     <div class="display-label">
         @Html.DisplayNameFor(model => model.Role)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.Role)
    </div>
</fieldset>

TeacherDetails.cshtml:

@model MvcEditorTemplatesTest.Models.Teacher

@{
    ViewBag.Title = "TeacherDetails";
}

<h2>TeacherDetails</h2>

<fieldset>
    <legend>Teacher</legend>
     <div class="display-label">
         @Html.DisplayNameFor(model => model.TeacherId)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.TeacherId)
    </div>
    <div class="display-label">
         @Html.DisplayNameFor(model => model.FirstName)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.FirstName)
    </div>

    <div class="display-label">
         @Html.DisplayNameFor(model => model.LastName)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.LastName)
    </div>
    <div class="display-label">
         @Html.DisplayNameFor(model => model.Role)
    </div>
    <div class="display-field">
        @Html.DisplayFor(model => model.Role)
    </div>
</fieldset>

F.在Site.css文件里的末尾添加:

#MyDDL
{
    width: 150px;
    height: 26px;
    background-color: #FF00FF;
}