提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
原创|行业资讯|编辑:龚雪|2013-11-13 10:45:38.000|阅读 165 次
概述:本文举例阐述了如何在模型和控制器之间使用ViewModel。
# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>
在企业应用开发场景,我们也许需要聚集一些模型/数据来源并将其呈现为一个整体控制器。简单起见,我们拿个需要输入新学生姓名、年级、州(如图一)的例子来说。
年级为A、B和C,但如果我们能够让这些年级显示为第一类、第二类、第三类,而非ABC,那或许会颇有意义。因此在UI中,我们需要显示第一二三类,但当保存数据是,我们需要在DB中保存相应的值,这同样适用于“州”。当用户点击“州”下拉选择图标时,州列表豁然出现并展示所有州。当选中一个州时,它被显示于UI中,但当保存到DB时,代码名称是诸如“Ca”代表“加利福尼亚”这样保存的,如图二所示。
图一:用来输入新生信息的表单。
图二:当点击州下来菜单时,如图菜单出现。
ViewModel(视图模型)的魔力:ViewModel允许你从一个或更多的数据模型/来源塑造多个实体到单个对象,优化了消耗和渲染。
图三就表明了ViewModel的理念:
图三:StudentViewModel集合了不同的模型和数据来源,提供信息给视图作为单个实体。
ViewModel的目的是将渲染单个对象的视图,缓解对UI逻辑代码的需求(原本是必需)。这意味着视图唯一的责任就是渲染该单个ViewModel对象,在一个更干净的关注点分离予以帮助。关注点是应用程序独特的一方面,它们有着特别的目的,而保持这些方面分离意味着你的应用程序更为有组织,代码更为聚焦。将数据操作代码置于其本身的位置,远离视图和控制器,增强关注点分离。在MVC中使用ViewModel将把你带向更加简单的可维护、可测试代码。
现在我们来我们创建数据来源。第一个是年级,代码如下。年级类是一个简单的Dictionary对象包含两类参数。类还包括Dictionary中所有成员的定义(如年级数据)。年级类唯一的属性就是显示列为清单的年级。GradeSelectList属性中的Dictionary<string, string>类相应地映射着年级缩写及年级名称。
public class Grades { public static SelectList GradeSelectList { get { return new SelectList(GradeDictionary, "Value", "Key"); } } public static readonly IDictionary<string, string> GradeDictionary = new Dictionary<string, string> { {"Choose…",""} , { "First Class", "A" } , { "Second Class", "B" } , { "Third Class", "c" } }; }
同样的login用于“州”。StatesDictionary的代码如下:
public class StatesDictionary { public static SelectList StateSelectList { get { return new SelectList(StateDictionary, "Value", "Key"); } } public static readonly IDictionary<string, string> StateDictionary = new Dictionary<string, string> { {"Choose…",""} , { "Alabama", "AL" } , { "Alaska", "AK" } , { "Arizona", "AZ" } , { "Arkansas", "AR" } , { "California", "CA" } , { "Colorado", "CO" } , { "Connecticut", "CT" } , { "Delaware", "DE" } , { "District of Columbia", "DC" } , { "Florida", "FL" } , { "Georgia", "GA" } , { "Hawaii", "HI" } , { "Idaho", "ID" } , { "Illinois", "IL" } , { "Indiana", "IN" } , { "Iowa", "IA" } , { "Kansas", "KS" } , { "Kentucky", "KY" } , { "Louisiana", "LA" } , { "Maine", "ME" } , { "Maryland", "MD" } , { "Massachusetts", "MA" } , { "Michigan", "MI" } , { "Minnesota", "MN" } , { "Mississippi", "MS" } , { "Missouri", "MO" } , { "Montana", "MT" } , { "Nebraska", "NE" } , { "Nevada", "NV" } , { "New Hampshire", "NH" } , { "New Jersey", "NJ" } , { "New Mexico", "NM" } , { "New York", "NY" } , { "North Carolina", "NC" } , { "North Dakota", "ND" } , { "Ohio", "OH" } , { "Oklahoma", "OK" } , { "Oregon", "OR" } , { "Pennsylvania", "PA" } , { "Rhode Island", "RI" } , { "South Carolina", "SC" } , { "South Dakota", "SD" } , { "Tennessee", "TN" } , { "Texas", "TX" } , { "Utah", "UT" } , { "Vermont", "VT" } , { "Virginia", "VA" } , { "Washington", "WA" } , { "West Virginia", "WV" } , { "Wisconsin", "WI" } , { "Wyoming", "WY" } // more states }; }
数据在小清单内并很少更改,如Grades,StatesDictionary类,存在于应用程序的所有类型中。
创建模型
现在我们需要一个模型来采集学生姓名、年级以及他/她来自哪个州(如图一所示)。StudentModels类定义捕捉这些特征于简单的数据结构中。我们现在创建一个如下的StudentModels。在Models文件夹下创建一个文件StudentModels.cs并添加如下代码:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.ComponentModel.DataAnnotations; namespace TagStatus.Models { public class StudentModels { [Display(Name = "Student Name here")] [Required()] public string StudentName { get; set; } public string Grade { get; set; } public string State { get; set; } } }
创建ViewModel
因为数据来自需要被展示在视图中的不同来源,如果你使用ViewModel,代码和维护将会很简单,ViewModels只是一个类。马上开始,创建一个新的文件夹命名为ViewModels并在其中添加一个新的代码文件StudentViewModel.cs。要创建StudentViewModel,添加StudentModels、Grades和StatesDictionary作为来自StudentViewModel的属性。在如下源代码中,StudentViewModel类包含新定义的属性。
using System; using System.Collections.Generic; using System.Linq; using System.Web; using TagStatus.Models; namespace TagStatus.ViewModels { public class StudentViewModel { public StudentModels Student { get; set; } public Grades Grades { get; set; } public StatesDictionary States { get; set; } public StudentViewModel(StudentModels student) { Student = student; Grades = new Grades(); States = new StatesDictionary(); } public StudentViewModel() { Student = new StudentModels(); ; Grades = new Grades(); States = new StatesDictionary(); } } }
创建控制器
在创建ViewModel之后,下一步就是在控制器中例示并将其返回到视图。我们是在这个新的MVC4上做R&D(研发)因此你将看到一些乱码。
如下代码创建一个控制器传送ViewModel到视图,而我们关注的代码是公共的ActionResult StudentInfo(),这在应用程序激活时被执行。
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using TagStatus.Models; using TagStatus.ViewModels; namespace TagStatus.Controllers { public class StudentController : Controller { //public string StudentName { get; set; } //public int Grade { get; set; } // // GET: /Student/ public ActionResult Index() { StudentModels stdm = new StudentModels(); StudentViewModel stdvm = new StudentViewModel(stdm); return View(stdvm); } //[AllowAnonymous] //public ActionResult StudentInfo() //{ // return View(); //} [AllowAnonymous] [HttpPost] public ActionResult StudentInfo(StudentModels model) { if (ModelState.IsValid) { model.StudentName = model.State; } return View(model); } [AllowAnonymous] public ActionResult StudentInfo() { StudentViewModel model = new StudentViewModel(); //model.StudentName = model.State; return View(model); } } }
在ASP.NET MVC 4视图中创建HTML5 Mobile Form
在Visual Studio 2010中,点击项目并新增Item命令以创建StudentInfo.cshtml。在视图内,各种ASP.NET MVC 4 HTML Helpers通过渲染它们映射于ViewModel的数据类型的最适合的HTML元素来呈现StudentViewModel组件。比如, 年级渲染为一个HTML下拉菜单由此用户可以轻易选中一个项目,而非手动进入之。
StudentInfo.cshtml代码如下:
@model TagStatus.ViewModels.StudentViewModel @{ ViewBag.Title = "Student Info"; } <h2> New Student </h2> @using (Html.BeginForm("Results","Home")) { @Html.ValidationSummary(true) <fieldset> <legend>Enter Student Information!</legend> <div class="editor-label"> @Html.LabelFor(model => model.Student.StudentName) </div> <div class="editor-field"> @Html.TextBoxFor(Model => Model.Student.StudentName) @Html.ValidationMessageFor(Model => Model.Student.StudentName) </div> <div class="editor-label"> @Html.LabelFor(model => model.Student.Grade) </div> <div class="editor-field"> @Html.DropDownListFor(Model => Model.Student.Grade, Grades.GradeSelectList) </div> <div class="editor-label"> @Html.LabelFor(model => model.Student.State) </div> <div class="editor-field"> @Html.DropDownListFor(Model => Model.Student.State, StatesDictionary.StateSelectList) </div> <p> <input type="submit" value="Save" /> </p> </fieldset> }
下载源代码请点击在Global.asax文件做如下改变:
routes.MapRoute( name: "Default", url: "{controller}/{action}/{id}", //defaults: new { controller = "Tag", action = "Lookup", id = UrlParameter.Optional } defaults: new { controller = "Student", action = "StudentInfo", id = UrlParameter.Optional } //defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional } );
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn
文章转载自:慧都控件网通过提供强大的3D CAD数据访问工具并适用于桌面、移动和Web的高级环境3D可视化发动机,HOOPS在提升造船设计和制造流程的效率方面发挥了重要作用。
HOOPS Luminate在汽车行业中的应用具有广泛的潜力和深远的影响。它通过提供高效的3D可视化、虚拟装配与拆解、性能分析、客户定制等功能,帮助汽车制造商在设计、生产和销售过程中提升效率、降低成本并提高产品质量。
在不断发展的软件开发世界中,使工具和框架与最新的平台版本保持同步至关重要,欢迎查阅~
全球航运业对国际贸易至关重要,全球 90% 以上的商品通过海运运输。准确监控和控制这些集装箱的移动对于维持高效的供应链至关重要。手动输入集装箱号码是这一程序的关键部分,它带来了相当大的挑战,例如人为错误和效率低下。
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@pclwef.cn
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢