web前端从无到有html标签,.NET MVC 扩展 HtmlHelper 从无到有(一)
对于MVC的html扩展一直都有想法,今天来小小尝试一下。
首先对扩展一无所知的我科普了一下MVC扩展:
OK,现在对System.Web.Mvc.Html进行反编译。
现在看到源码了,那么一切都不是问题了。
页面: @Html.RadioFor(a=>a.BId)
扩展:
public static MvcHtmlString RadioFor(this HtmlHelper htmlHelper, Expression> expression)
{
string format = null;
ModelMetadata modelMetadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
//return htmlHelper.TextBoxFor(expression, format);
//return InputExtensions.HiddenHelper(htmlHelper, modelMetadata, modelMetadata.Model, false, ExpressionHelper.GetExpressionText(expression), htmlAttributes);
StringBuilder sb = new StringBuilder();
sb.Append("传进来的参数值:" + modelMetadata.GetDisplayName() + "=" + modelMetadata.Model + "");
sb.Append("传进来的参数值:" + modelMetadata.PropertyName+ "=" + modelMetadata.Model + "");
return MvcHtmlString.Create(sb.ToString());
}
结果:
先在初步的扩展已经成功,对于ModelMetadata元数据想做更深了解的请百度科普- -
现在我们拿到了传进来的参数名和参数值,有了这两个值,那么我的radio扩展就相当与有了目标选中项。
传说有个TagBuilder的东西创建html helpers很方便,由于暂时不是很了解, 所以我们先用字符串去拼接一个html.
最终页面调用:
@Model.Zxr
@Html.RadioFor(a=>a.Zxr,(ViewBag.rad)as IEnumerable)
扩展:
public static MvcHtmlString RadioFor(this HtmlHelper htmlHelper, Expression> expression, IEnumerable selectList)
{
string format = null;
var modelMetadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData);
return MvcHtmlString.Create(GetRadioHtmlBuilder(htmlHelper, modelMetadata, selectList, string.Empty, string.Empty, "Radio").ToString());
}
///
/// 拼接成的Radion或者CheckBox的Html字符串
///
/// html控件
/// model元
/// 要分析的list
/// 默认值
/// 默认文本
/// input类型
///
private static StringBuilder GetRadioHtmlBuilder(HtmlHelper htmlHelper, ModelMetadata metadata, IEnumerable selectList, string optionVal, string optionText, string optionType)
{
string format = string.Format("{{3}} ", optionType);
var sb = new StringBuilder();
var optionId = 0;
if (optionVal.Length > 0)
{
sb.Append(string.Format(format, new object[]
{
metadata.PropertyName + optionId,
metadata.PropertyName,
optionVal,
optionText,
metadata.Model.ToString()==optionVal?"checked=\"checked\"":string.Empty
}));
optionId++;
}
var selectListItems = selectList as SelectListItem[] ?? selectList.ToArray();
if (selectListItems.Any())
{
foreach (var item in selectListItems)
{
sb.Append(string.Format(format, new object[]
{
metadata.PropertyName + optionId,
metadata.PropertyName,
item.Value,
item.Text,
metadata.Model.ToString()==item.Value?"checked=\"checked\"":string.Empty
}));
optionId++;
}
}
return sb;
}
结果图:
注意点:
扩展方法必须静态,而且返回值必须是MvcHtmlString. 假如返回string的话,在页面需要@Html.Raw(XX)才可以。
加入后台传入Viewbag的是selectlist(System.Web.Mvc中自带的),那么前台使用方法有:(ViewBag.rad)as IEnumerable 和(ViewBag.rad)as List
转载请标明出处:http://blog.csdn.net/feng005211/article/details/25420255
web前端从无到有html标签,.NET MVC 扩展 HtmlHelper 从无到有(一)相关推荐
- web前端 HTML常用标签,标签分类
1.什么是标签 #1.在HTML中规定标签使用英文的的尖括号即<和>包起来,如<html>.<head>.<body>都是标签, #2. HTML中标签 ...
- Web前端笔记-i标签做小图标以及改源码注意事项
目录 最简单的使用i标签做小图标 修改前端源码注意的问题 最简单的使用i标签做小图标 运行截图如下: 实例结构如下: 此处就是使用i标签制作的小图标 其中html源码如下: <html> ...
- Web前端:HTML标签——Visual Studio Code
[前提] 掌握HTML结构 掌握HTML常用标签的使用 [知识] [要求] 使用HTML标签完成<糖醋排骨>菜谱练习 使用HTML标签完成<楚乔传>网页练习 扩展:点击集数跳转 ...
- WEB前端 HTML 基本标签
文章目录 系统架构 B/S B/S架构的系统代表 C/S架构 HTML 图示思路 标签 头 head 标题 title 身体 body 图示结果 图示概念 标签 段落 图示结果 图示概念 标题字 图是 ...
- web前端:2_标签进阶标签属性
1,图片 img标签 <!--图片标签 img --> <!-- <img src="图片路径-相对路径" ,alt="图片描述" ,w ...
- web前端知识——iframe标签、CSS
一.iframe标签 用于在一个网页里面打开另一个网页 <iframe src="https://www.taobao.com" frameborder="0&qu ...
- Web前端 HTML常用标签 文本格式化标签 图像标签
文本格式化标签 在网页中,有时需要为文字设置粗体.斜体或下划线等效果,这就需要用到HTML中的文本格式化标签,使文字以特殊的方式显示. 标签语义:突出重要性,比普通文字更重要 语义 标签 说明 加粗 ...
- Web前端开发 table标签相关用法和属性
table标签 html中的<table>标签,通常用于对页面布局的规划. 一.<table>标签简介 table标签用于在网页中建立表格布局,其子标签有<tr>& ...
- 【Web前端】 HTML标签(下)
目录 1. 表格标签 (1)表格的主要作用 (2) 表格的基本语法 (3)表头单元格标签 (4)表格属性 (5)表格结构标签 (6)合并单元格: 2.列表标签 (1)无序列表 (2)有序列表 (3)自 ...
最新文章
- Makefile实例分析
- python websocket实现消息推送_Python Websocket消息推送---GoEasy
- SAP UI5 应用开发教程之四:XML 视图初探
- python parser count_8 个 Python 实用脚本,早掌握早下班!
- 增量导出_[华为]一种实用的增量式深度CTR模型训练方法
- js 台阶有n级_乔欣这是“开眼角”了?只在眼妆中多加这一步,整个人变美了N倍...
- python菜鸟教程网-Python JSON
- linux shell学习-1
- docker使用阿里云仓库上传与下拉images
- 世界上第一块商用微型处理器4004
- 训练报错:RuntimeError: CUDA error: device-side assert triggered
- 排列组合 C语言函数,排列组合c怎么算 计算方法是什么
- 计算机1500字论文,当我打开电脑_1500字
- 大牛教你这样阅读android源码
- 3G终端变局:安卓崛起 联通高调摆脱苹果
- 【Docker】Registry搭建私有仓库、证书认证、用户登录认证
- 使用Java编写欧式期权理论理论计算公式
- 外汇天眼:英国研究人员与南非合作应对气候变化
- Iperf 详细介绍
- PAT福尔摩斯的约会