MVC4学习笔记（四）

个人理解

就是说你的项目不可能每条数据都是TextBox能解决的吧，所以你要改，什么textarea,dropdownlist,selectlist之类的你都要设计，这也是Mvc的一个缺点，没有可视化的组件给你直接拖上来（cshtml视图有，貌似这个用的不多），可能下载一些插件什么的能实现吧，但Lz目前还没发现

1.1.  Label设计

     

<div class="editor-label">2             @Html.LabelFor(model => model.TeacherName)3 </div>

1.2.  Textbox设计

        <div class="editor-field">2 3             @Html.EditorFor(model => model.TeacherName)4 5             @Html.ValidationMessageFor(model => model.TeacherName)6 7         </div>

 

1.3.  Textarea设计

        

<div class="editor-field">2 3             @Html.TextArea("ContinuingEducation", Model.ContinuingEducation, 5, 50, null)4 5         </div>

 

1.4.  下拉框设计

修改Control在类顶加入如下加粗部分字段

namespace TeacherManageSystem.Controllers{    [HandleError]    [UserAuthorizeAttribute(Roles = "teacher")]    public class TeacherProjectController : Controller    {        private TMSEntities db = new TMSEntities(); List<string> projectTypeList = new List<string>();       List<string> manageTypeList = new List<string>();        TeacherInfo teacherInfo;        //        // GET: /TeacherProject/        public ActionResult Index(string title)

 

在相关的action里绑定数据

        // 2  3         // GET: /TeacherProject/Create 4  5         public ActionResult Create() 6  7         { 8  9             projectTypeList.Add("自然科学类");10 11             projectTypeList.Add("社会科学类");12 13             ViewData["projectType"] = new SelectList(projectTypeList);14 15             manageTypeList.Add("主持");16 17             manageTypeList.Add("参与");18 19             ViewData["manageType"] = new SelectList(manageTypeList);20 21             return View();22 23         }

 

修改view对应位置

     <div class="editor-label"> 2  3             @Html.LabelFor(model => model.ProjectType) 4  5         </div> 6  7         <div class="editor-field"> 8  9             @Html.DropDownList("ProjectType", (SelectList)ViewData["projectType"])10 11             @Html.ValidationMessageFor(model => model.ProjectType)12 13         </div>

 

1.5.  单选项设计

     

   [DisplayName("是否申请专利")]2 3         /// <summary>4 5         /// 是否取得专利6 7         /// </summary>8 9         public bool IsPatent { get; set; }

 

1.6.  滚动新闻效果设计

<MARQUEE onmouseover=this.stop() onmouseout=this.start()scrollAmount=4 width=400 height=150 direction="up"> 你要滚动的内容</MARQUEE>

 

把这段直接放在<td></td>中
解释：
onmouseover=this.stop()是鼠标悬浮停止
onmouseout=this.start()是鼠标离开继续滚动
width和height分别是宽度和高度.根据需要自定义大小.
BGColor：滚动文本框的背景颜色。
scrollamount：一次滚动总的时间量，数字越小滚动越慢。
Behaviour：滚动的方式设置，三种取值：Scroll（循环滚动） lide（单次滚动）、Alternate（来回滚动）。
align：文字的对齐方式设置。可选择Middle(居中)、Bottom(居下)还是Top(居上)。
direction:表示滚动的方向，默认为从右向左：←←←。可选的值有right、down、up。滚动方向分别为：right表示→→→，up表示↑，down表示↓。
scrollDelay:这也是用来控制速度的，默认为90，值越大，速度越慢。通常scrollDelay是不需要设置的。

 未完待续。。。