在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明。有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么,我们就可以通过自己定义一个Html扩展方法来达到这个目的。

  比如,到目前为止,Html扩展方法中没有关于<input type="file" />这类标签的辅助方法,那么我们就可以自已实现一个。本文以实现<input type="file" />标签为例,演示如何实现自定义Html扩展方法。

  一、实现自定义弱类型Html扩展方法

  其实实现自定义Html扩展方法并不难,有兴趣的同学可以去看下MVC源代码,关于Html扩展方法部分。要用到System.Web.Mvc命名空间下的TagBuilder类,MvcHtmlString类。TagBuilder类为Html辅助方法生成HTML标签,MvcHtmlString代表HTML编码的字符串。扩展方法代码如下所示:

代码

publicstaticclass MyInputExtensions
{
publicstatic MvcHtmlString Input(this HtmlHelper htmlHelper, string name)
{
TagBuilder tagBuilder =new TagBuilder("input");//设置标签类型为input
tagBuilder.Attributes.Add("type", "file");//为标签添加type属性及值
tagBuilder.Attributes.Add("name", name);//为标签添加name属性及值
 tagBuilder.GenerateId(name);//为标签生成Id,name参数代码Id的值
//创建经过HTML加密的字符串
//TagRenderMode.SelfClosing枚举值代表当前标签是自动关闭的
return MvcHtmlString.Create(tagBuilder.ToString(TagRenderMode.SelfClosing));
}
}

  需要特别提醒的是,扩展方法类所在的命名空间最好设置为System.Web.Mvc,这样,我们在View中可以通过智能感知轻易找到,也不容易出错或者无法通过VS智能感知找到我们自定义的Html辅助方法,可以为我们省去很多不必要的麻烦。将上面代码编译,我们即可在View中通过智能感知看到我们自定义的Html辅助方法。如下图所示:

  使用方法和其它Html辅助方法一样,如下代码所示:

<%: Html.Input("Path") %>
//字符串参数Path代表生成标签的name属性和id属性的值

需要说明的是,本例所示是为了生成<input type="file">标签,是不用设置值的,读者可以通过自身情况定义扩展方法。然后运行,通过浏览器查看HTML源代码,如下图所示:

  二、实现自定义强类型Html辅助方法

  强类型辅助方法的一个好处是,我们可以通过编译器为我们检测一些错误,为我们节省一些排错的时间与精力。所以,强类型Html辅助方法是不可缺少的。代码如下:

代码

publicstaticclass MyInputExtensions
{
publicstatic MvcHtmlString Input<TModel, TValue>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>> expression)
{
string modelName = ExpressionHelper.GetExpressionText(expression);//从Lambda表达式中获取模型对应属性的名称
TagBuilder tagBuilder =new TagBuilder("input");//设置标签类型为input
tagBuilder.Attributes.Add("type", "file");//为标签添加type属性及值
tagBuilder.Attributes.Add("name", modelName);//为标签添加name属性及值
tagBuilder.GenerateId(modelName);//为标签生成Id,name参数代码Id的值
//创建经过HTML加密的字符串
//TagRenderMode.SelfClosing枚举值代表当前标签是自动关闭的
return MvcHtmlString.Create(tagBuilder.ToString(TagRenderMode.SelfClosing));
}
}

  然后我们编译,在View中,我们就可以通过智能感知看到我们新扩展的强类型Html辅助方法了。如下图所示:

  

  我们可以通过如下代码使用新扩展的Html辅助方法:

<%: Html.Input(model => model.Path) %>
//Path代表model的Path属性,生成标签的name和id的属性值均会是Path

  运行,我们通过浏览器查看生成的Html源代码如下图所示:

  

  三、为标签错误输入添加CSS支持

  对于要求输入的标签,如Text,如果用户输入错误内容,我们可以为当前标签添加CSS错误提示,为用户提供一个更加友好、人性化的界面。代码如下所示:

代码

ModelState modelState;
if (htmlHelper.ViewData.ModelState.TryGetValue(name, out modelState))
{
if (modelState.Errors.Count >0)
{
//添加错误提示CSS
tagBuilder.AddCssClass(HtmlHelper.ValidationInputCssClassName);
}
}

  将以上代码复制到我们自定义的扩展方法的返回MvcHtmlString字符串之前即可。

  四、总结

  本文通过演示如果实现自定义<input type="file" />标签的Html辅助方法,展示了如何在ASP.NET MVC中实现自定义Html辅助方法。对于ASP.NET MVC程序员来说,这是非常实用的。

原文地址:http://www.cnblogs.com/myshell/archive/2010/05/09/1731269.html

[转载]自定义ASP.NET MVC Html辅助方法 TagBuilder的更多相关文章

  1. 转:自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  2. 【MVC】自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  3. 自定义ASP.NET MVC Html辅助方法

    在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其重要性也就不言自明.有时候,我们不想重复地写一些HTML代码,或者MS没有提供我们想要的那个HTML标签的Html辅助方法,那么 ...

  4. 【草稿】自定义ASP.NET MVC Html辅助方法

    https://www.cnblogs.com/myshell/archive/2010/05/09/1731269.html 在ASP.NET MVC中,Html辅助方法给我们程序员带来很多方便,其 ...

  5. 【转载】 Asp.Net MVC网站提交富文本HTML标签内容抛出异常

    今天开发一个ASP.NET MVC网站时,有个页面使用到了FCKEditor富文本编辑器,通过Post方式提交内容时候抛出异常,仔细分析后得出应该是服务器阻止了带有HTML标签内容的提交操作,ASP. ...

  6. vs 2013下自定义ASP.net MVC 5/Web API 2 模板(T4 视图模板/控制器模板)

    vs 2013下自定义ASP.net MVC 5/Web API 2  模板(T4 视图模板/控制器模板): Customizing ASP.NET MVC 5/Web API 2 Scaffoldi ...

  7. 【转载】ASP.NET中Server.MapPath方法获取网站根目录总结

    在ASP.NET网站应用程序中,可以通过Server.MapPath方法来获取跟服务器有关的目录信息,如获取网站的根目录.获取当前代码文件所在的目录路径.获取当前代码所在路径的上级路径等.Server ...

  8. 【转载】ASP.NET MVC重写URL制作伪静态网页,URL地址以.html结尾

    在搜索引擎优化领域,静态网页对于SEO的优化有着很大的好处,因此很多人就想把自己的网站的一些网页做成伪静态.我们现在在网络上发现很多博客网站.论坛网站.CMS内容管理系统等都有使用伪静态这一种情况,伪 ...

  9. 【转载】ASP.NET MVC设置允许跨域访问

    默认情况下,浏览器端发送Ajax请求一般被禁止跨域访问,如A域名网站访问B域名网站的请求会被终止,在ASP.NET MVC项目中,我们可以配置相应的设置项,允许网站的接口跨域访问,主要需要设置Acce ...

随机推荐

  1. Linux 命令 - ftp: 网络文件传输工具

    命令格式 ftp [-pinegvd] [host] 命令参数 -A 传输文件模式为主动模式. -p 传输文件模式为被动模式. -i 关闭交互模式. -n 关闭自动登录功能. -e 不记录历史命令. ...

  2. R语言diagram包画订单状态流图

    代码如下: library("diagram") #a <- read.table(file="clipboard",header=TRUE) write ...

  3. 关于对XE7中introduced in an ancestor and cannot be deleted的解决方案

    在Delphi XE7中设计Multi-Device Application 类型窗体中,发现删除一个组件时,提示introduced in an ancestor and cannot be del ...

  4. 译:Spring框架参考文档之IoC容器(未完成)

    6. IoC容器 6.1 Spring IoC容器和bean介绍 这一章节介绍了Spring框架的控制反转(IoC)实现的原理.IoC也被称作依赖注入(DI).It is a process wher ...

  5. JavaScript动画附源码(一)

        JavaScript完成动画程序 1,效果图: 以上是纯CSS+JavaScript实现的.点击关闭按钮可以动态关闭这个方框.兼容IE/FF/Chrome.这样的效果如果用jquery实现起来 ...

  6. MyEclipse SVN 插件

    一.下载SVN插件subclipse 下载地址:http://subclipse.tigris.org/servlets/ProjectDocumentList?folderID=2240 在打开的网 ...

  7. 有道单词本添加js实现自动阅读单词

    个人比较习惯使用有道,使用了一段时间,背单词的时候很不方便   而有道单词客户Duan没有自动阅读的功能,  本菜用强大的js实现了简单的自动下一个单词的功能, 方法:第一步打开有道路径下的" ...

  8. 插件笔记——dataTables使用说明

    jquery DataTables中文使用说明 出处:http://blog.vunso.com/201405/jquery-datatables%E4%B8%AD%E6%96%87%E4%BD%BF ...

  9. Linux ---> 简单socket

    #include <stdio.h> #include <stdlib.h> #include <errno.h> #include <string.h> ...

  10. 实现cookie跨域访问

    需求:A系统(www.a.com)里设置一个浏览器cookie,B系统(www.b.com)需要能够访问到A设置的cookie. 通过HTML SCRIPT标签跨域写cookie: 由于html的sc ...