Extend Html.EditorFor MVC
原文发布时间为:2011-09-07 —— 来源于本人的百度文章 [由搬家工具导入]
Attachment(s): ExtendedEditorFor.zip
Adding html attributes support for Templates - ASP.Net MVC 2.0 Beta
ASP.Net mvc 2.0 beta, supports templates feature. Templates are a way to write reusable view code. They significantly simplifies the code we need to write in views.
You can read more about templates here.
In this post I will show a way to extend the ModelMetadata and add support for Html Attributes which can be used in templates.
Let us assume there is a view model for "Employee"
1:publicclass Employee 2: { 3:publicstring Title { get; set; } 4:publicstring FirstName { get; set; } 5:publicstring LastName { get; set; } 6: }
Here is the controller’s action to render the view model
1:publicclass HomeController : Controller 2: { 3:public ActionResult Index() 4: { 5: Employee employee = new Employee(); 6:return View(employee); 7: } 8: }
And the view code
<% using(Html.BeginForm())%><p><%=Html.EditorFor(e => e.Title)%></p><p><%=Html.EditorFor(e => e.FirstName)%></p><p><%=Html.EditorFor(e => e.LastName)%></p><%%>
Html for the Title field will be rendered as the following
<inputtype="text"value=""name="Title"id="Title"/>
What if we want to limit text box size of the title property and amount of data user can enter in to the textbox?
Default metadata for the view model won’t allow us to specify these attributes. Or the EditorFor signature won’t allow us pass in any additional html attributes.
Instead of EditorFor, we could use TextBoxFor in the simple scenarios. EditorFor enables the use of templates and it would be nice to have similar support for Html attributes.
One way to solve this is by decorating the view model with our own custom attributes as shown in the following snippet.
publicclass Employee{ [HtmlProperties(Size = 5, MaxLength = 10)]publicstring Title { get; set; }publicstring FirstName { get; set; }publicstring LastName { get; set; }}
Here we decorated the Title property with a custom attribute called “HtmlProperties”. This attribute has a Size property and MaxLength property.
Code for HtmlPropertiesAttribute is straight forward.
[AttributeUsage(AttributeTargets.Field | AttributeTargets.Property,AllowMultiple=false,Inherited=true)]publicclass HtmlPropertiesAttribute : Attribute {publicstring CssClass { get; set; }publicint MaxLength { get; set; }publicint Size { get; set; }public IDictionary<string,object> HtmlAttributes() {//Todo: we could use TypeDescriptor to get the dictionary of properties and their values IDictionary<string, object> htmlatts = new Dictionary<string, object>();if (MaxLength != 0) { htmlatts.Add("MaxLength", MaxLength); }if (Size != 0) { htmlatts.Add("Size", Size); }return htmlatts; } }
There is an utility method HtmlAttributes that spits out the dictionary of html attributes for use of use later.
Next we need to make the metdata provider aware of our new attribute. MetadaProvides reads the metadata from the properties of view model and makes it available to the templates.
Out of the box implementation for ModelMetaDataProvider is DataAnnotationsModelMetadataProvider. This provider has overridable method CreateMetadata.
From mvc 2.0 beta, modelmetadata supports a dictionary called AdditionalValues, which we can use as a backing store for our new metadata “HtmlAttributes”
Following is the code for our new metadataprovider
publicclass MetadataProvider : DataAnnotationsModelMetadataProvider {protectedoverride ModelMetadata CreateMetadata(IEnumerable<Attribute> attributes, Type containerType,Func<object> modelAccessor,Type modelType,string propertyName) { var metadata = base.CreateMetadata(attributes, containerType, modelAccessor, modelType, propertyName); var additionalValues = attributes.OfType<HtmlPropertiesAttribute>().FirstOrDefault();if(additionalValues != null) { metadata.AdditionalValues.Add("HtmlAttributes", additionalValues); }return metadata; } }
Once the metadata provider is ready, we need to make the template aware of this new property.
Out of the box, mvc provides a string template to render the string properties of the view model. We can override the default implementation by creating a ViewUserControl called string.ascx under “Views\Shared\EditorTemplates” folder of mvc project. EditorTemplates is a new folder we need create to customize the out of box templates.
string.ascx code is shown bellow.
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %><% var htmlAttributes = new HtmlPropertiesAttribute();if(ViewData.ModelMetadata.AdditionalValues.ContainsKey("HtmlAttributes")) htmlAttributes = (HtmlPropertiesAttribute) ViewData.ModelMetadata.AdditionalValues["HtmlAttributes"]; htmlAttributes.HtmlAttributes().Add("class", "text-box single-line " + htmlAttributes.CssClass); %> <span> <%= Html.Label(ViewData.ModelMetadata.PropertyName) %> <%=Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue,htmlAttributes.HtmlAttributes()) %> </span>
Here we simply retrieve the HtmlAttributes dictionary from the additional values and calls its “HtmlAttributes” method and pass them to TextBox helper method.
We need to one more code change in order to tie every thing together. In the Global.asax file, application_start method, we need to add code to replace the current ModelMetadataProvider with our implementation of metadataprovider.
protectedvoid Application_Start() { AreaRegistration.RegisterAllAreas(); RegisterRoutes(RouteTable.Routes); ModelMetadataProviders.Current = new MetadataProvider(); }
Rendered html code for the title after our modifications is as follows
<inputtype="text"value=""name="Title"id="Title"size="5"maxlength="10"/>
I provided the final solution as an attachment to this post
Extend Html.EditorFor MVC的更多相关文章
- OWIN support for the Web API 2 and MVC 5 integrations in Autofac
Currently, in the both the Web API and MVC frameworks, dependency injection support does not come in ...
- 新的表格展示利器 Bootstrap Table
1.bootstrap table简介及特征 Bootstrap Table是国人开发的一款基于 Bootstrap 的 jQuery 表格插件,通过简单的设置,就可以拥有强大的单选.多选.排序.分 ...
- 新的表格展示利器 Bootstrap Table Ⅰ
1.bootstrap table简介及特征 Bootstrap Table是国人开发的一款基于 Bootstrap 的 jQuery 表格插件,通过简单的设置,就可以拥有强大的单选.多选.排序.分 ...
- 在Asp.Net MVC中PartialView与EditorFor和DisplayFor的区别
相同之处: PartialView, EditorFor 和 DisplayFor 都可以用作来实现页面的公共部分,其他页面可以根据需求来引用. 不同之处: PartialView 是从Page的角度 ...
- mvc中EditorFor TextBoxFor什么区别
EditorFor 是映射到Model 属性上面,忽略用户自定义属性和样式 Model 可以为nullTextBoxFor是映射到Model 属性上面,可以用户自定义属性和样式 Model 不可以为n ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(9)-MVC与EasyUI结合增删改查
系列目录 文章于2016-12-17日重写 在第八讲中,我们已经做到了怎么样分页.这一讲主要讲增删改查.第六讲的代码已经给出,里面包含了增删改,大家可以下载下来看下. 这讲主要是,制作漂亮的工具栏,虽 ...
- ASP.NET MVC 5 - 验证编辑方法(Edit method)和编辑视图(Edit view)
在本节中,您将验证电影控制器生成的编辑方法(Edit action methods)和视图.但是首先将修改点代码,使得发布日期属性(ReleaseDate)看上去更好.打开Models \ Movie ...
- 学习ASP.NET MVC(六)——我的第一个ASP.NET MVC 编辑页面
在上一文章中由Entity Framework(实体框架)去实现了对数据库的CURD操作.在本篇文章中,主要是调试修改自动生成的动作方法和视图,以及调试编辑功能与编辑功能的Book控制器. 首先,在V ...
- ASP.NET MVC 学习4、Controller中添加SearchIndex页面,实现简单的查询功能
参考:http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-edit-method ...
随机推荐
- php-5.6.26源代码 - 如何用C语言支持“类似异常”机制
代码编写在文件php-\Zend\zend.h #define zend_bailout() _zend_bailout(__FILE__, __LINE__) #ifdef HAVE_SIGSETJ ...
- GMT 时间格式转换到 TDateTime (Delphi)
//GMT 时间格式转换到 TDateTime //忽略时区 function GMT2DateTime(const pSour:PAnsiChar):TDateTime; function GetM ...
- 20145202课后题,2.56&9.16
我做的是2.56题,要求我用多组值来测试show_bytes 9.16 主要是对局部性进行了一些分析. 实验楼里面是空的,我电脑上显示不出来,所以我就做了一些书上的习题. 第十章的所有题目都被学长做过 ...
- 12,DBUtils - Python数据库连接池
创建数据库连接池: import time import pymysql import threading from DBUtils.PooledDB import PooledDB, SharedD ...
- WPF点击不同界面上的按钮实现界面切换
原文:WPF点击不同界面上的按钮实现界面切换 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/qq_29844879/article/details/ ...
- android 文件下载 超简单
public void downloadPlug(String downloadUrl,String savePath) { try { URL url = new URL(downloadUrl); ...
- idea无法新建maven项目
之前用的都是eclipse,自从4月底入职新公司后,接触到了idea. 然后自己的电脑上也安装了idea,不过一直都没用,直到昨天打算开起来使用一下. 之后就是想新建一个maven项目,发现死活也新建 ...
- Jsoncpp 编译
1. linux下编译jsoncpp 从(http://jsoncpp.sourceforge.net/)下载源码包“jsoncpp-src-0.5.0.tar.gz”,解压后在其解压后目录中运行 $ ...
- Jforum环境搭建
前提:搭建好JDK.JRE.Tomcat.数据库 1.之前安装了Navicat Premium,所以直接用这个创建名为jforum的MySQL数据库,默认密码为空,记得设置密码,因为Jforum要用到 ...
- Python全栈 MySQL 数据库(SQL命令大全、MySQL 、Python调用)
为了梦想与了信仰 开局一张图 主要三个方面: 1.Linux终端命令 2.MySQL语句 3.Python调用 先删库 再跑路..... ...