现有控件:

例如ASP.NET MVC框架包括以下设置标准的HTML控件(部分控件):

  • Html.ActionLink()
  • Html.BeginForm()
  • Html.CheckBox()
  • Html.DropDownList()
  • Html.EndForm()
  • Html.Hidden()
  • Html.ListBox()
  • Html.Password()
  • Html.RadioButton()
  • Html.TextArea()
  • Html.TextBox()

Html控件的返回值

每一个Html控件都返回了MvcHtmlString ,他继承了HtmlString,微软把他定义为不能再次编辑的Html字符串。如MvcHtmlString : HtmlString。

知道了返回值我们就知道从哪里入手写自己的控件了。

自定义Html控件

先看个例子

我们用html写这样一段代码

<label for='male'>男</label>
<input type="radio" name="sex" id="male" />
<br />
<label for='female'>女</label>
<input type="radio" name="sex" id="female" />

  

其运行效果为:


在MVC项目中添加一个Controls文件夹

添加名为MyControls的类

代码:

 
    public class MyControls
{
/// <summary>
/// Lable文本
/// </summary>
/// <param name="fortarget">for属性</param>
/// <param name="text">显示文本</param>
/// <returns></returns>
public static MvcHtmlString Label(string fortarget, string text)
{
string str = String.Format("<label for='{0}'>{1}</label>", fortarget, text);
return new MvcHtmlString(str); } public static MvcHtmlString Label(string text)
{
return Label("",text);
} /// <summary>
/// RadioButton
/// </summary>
/// <param name="nametarget">name属性</param>
/// <param name="idtarget">id属性</param>
/// <returns></returns>
public static MvcHtmlString RadioButton(string nametarget, string idtarget)
{
string str = String.Format("<input type='radio' name='{0}' id='{1}' />", nametarget, idtarget);
return new MvcHtmlString(str);
}
}
 

  

上面两个控件我们都返回了MvcHtmlString ,用于将String的内容显示为Html内容。

Html代码:

@using MvcApplication.Controls;
@MyControls.Label("male", "男")
@MyControls.RadioButton("sex", "male")
<br />
@MyControls.Label("female", "女")
@MyControls.RadioButton("sex", "female")

运行效果

可以看到与上面标准的Html代码效果是一样的。

Html控件自定义扩展

上面的例子我们可以看出自定义的控件完全可以让我们简单的实现自己想要的功能。

但是这些要使用自己的命名空间,而且还要找到自己定义的控件类,有点麻烦,能不能整合到系统自己的Html控件库呢?

像这种?

回答当然是肯定的,我们可以将这些自己的控件做为系统控件的扩展控件,在调用的时候不是就简单而且亲切嘛?

 

Html控件扩展类

先看下面的代码

        //
// 摘要:
// 获取或设置 System.Web.Mvc.HtmlHelper 对象,该对象用于呈现 HTML 元素。
//
// 返回结果:
// 用于呈现 HTML 元素的 System.Web.Mvc.HtmlHelper 对象。
public HtmlHelper<TModel> Html { get; set; }

这是系统对页面上@Html属性的定义。

我们可以看到该Html是返回了一个HtmlHelper

看到这里我们的入口点就找到了,就是以HtmlHelper作为扩展类型。

继续在建好的Controls文件夹中建立名为LabelExtensions的类和RadioButtonExtensions的类

代码

    public static class LabelExtensions
{
public static MvcHtmlString LKLabel(this HtmlHelper helper, string fortarget, string text)
{
string str = String.Format("<label for='{0}'>{1}</label>", fortarget, text);
return new MvcHtmlString(str);
}
} public static class RadioButtonExtensions
{
public static MvcHtmlString LKRadioButton(this HtmlHelper helper, string nametarget, string idtarget)
{
string str = String.Format("<input type='radio' name='{0}' id='{1}' />", nametarget, idtarget);
return new MvcHtmlString(str); }
}

  

调用控件

此时我们再写Html控件看看

页面代码

@using MvcApplication.Controls;
@Html.LKLabel("male", "男")
@Html.LKRadioButton("sex", "male")
<br />
@Html.LKLabel("female", "女")
@Html.LKRadioButton("sex", "female")

  

运行效果

这些例子,挺好的,学习用,还行

MVC 3.0学习笔记(自定义控件)的更多相关文章

  1. MVC缓存OutPutCache学习笔记 (二) 缓存及时化VaryByCustom

    <MVC缓存OutPutCache学习笔记 (一) 参数配置> 本篇来介绍如何使用 VaryByCustom参数来实现缓存的及时化.. 根据数据改变来及时使客户端缓存过期并更新.. 首先更 ...

  2. MVC缓存OutPutCache学习笔记 (一) 参数配置

    OutPutCache 参数详解 Duration : 缓存时间,以秒为单位,这个除非你的Location=None,可以不添加此属性,其余时候都是必须的. Location : 缓存放置的位置; 该 ...

  3. ASP.NET MVC Web API 学习笔记---第一个Web API程序

    http://www.cnblogs.com/qingyuan/archive/2012/10/12/2720824.html GetListAll /api/Contact GetListBySex ...

  4. DirectX 总结和DirectX 9.0 学习笔记

    转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...

  5. 一起学ASP.NET Core 2.0学习笔记(二): ef core2.0 及mysql provider 、Fluent API相关配置及迁移

    不得不说微软的技术迭代还是很快的,上了微软的船就得跟着她走下去,前文一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx.superviso ...

  6. vue2.0学习笔记之路由(二)路由嵌套+动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. vue2.0学习笔记之路由(二)路由嵌套

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. hdcms v5.7.0学习笔记

    hdcms v5.7.0学习笔记 https://note.youdao.com/ynoteshare1/index.html?id=c404d63ac910eb15a440452f73d6a6db& ...

  9. dhtmlxgrid v3.0学习笔记

    dhtmlxgrid v3.0学习笔记 分类: dhtmlx JavaScript2012-01-31 15:41 1744人阅读 评论(0) 收藏 举报 stylesheetdatecalendar ...

随机推荐

  1. thinkcmf 角色授权支持分类

    ThinkCMF中的权限是以后台菜单为基础来进行设置的(menu table),即如果你需要一个自定义的权限,那么你需要在后台菜单里添加一项菜单,然后在角色管理里可以针对角色进行授权   而现在遇到一 ...

  2. 调用百度、高德地图App,百度地图网页版,App定位

    https://www.jianshu.com/p/296a3995adc2 https://blog.csdn.net/qq_26598821/article/details/51087785 ht ...

  3. virtualBox导入虚拟机启动报错

    今天使用Oracle VMbox在导入虚拟机后,启动时报了如下错误: A new node couldn't be inserted because one with the same name ex ...

  4. 【转】使用 Android 的日志工具LogCat

    Android中的日志工具类是 Log(android.util.Log),这个类中提供了如下几个方法来供我们打印日志. 1.    Log.v() 这个方法用于打印那些最为琐碎的,意义最小的日志信息 ...

  5. Lintcode: Add Two Numbers

    C++ /** * Definition for singly-linked list. * struct ListNode { * int val; * ListNode *next; * List ...

  6. IIS 7 及以上 IIS错误页“编辑功能设置...”提示“锁定冲突”

    原因是全局的设置锁定了此项,不让修改. 解决方法如下:

  7. 玩转Bootstrap

    一:bootstrap基本模版 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  8. system.DateTime ToDateTime(System.String)”,因此该方法无法转换为存储表达式-解决方法

    LINQ to Entities的lambda表达式中如果需要转换时间及各种时间格式请使用System.Data.Entity的类DbFunctions的各种方法 例如: IsOverdue = db ...

  9. Microsoft Excel as a Source and Target as Oracle in ODI

    创建测试表格和目标表 导出scott用户的emp表为EMP.xlsx作为测试的元数据,结果如下 打开EMP.xlsx 公式→定义名称 创建目标表(来自scott.sql) CREATE TABLE E ...

  10. Oracle NET工作原理、配置及连接问题排查

    一.Oracle NET配置文件 Oracle NET是一个软件层,支持不同网络协议之间的转换.不同的物理机器可以借助这个软件层实现相互间的通信,具体而言就是实现对oracle的远程访问. oracl ...