ASP.NET MVC控件解析

最新推荐文章于 2024-04-29 19:58:05 发布
最新推荐文章于 2024-04-29 19:58:05 发布
阅读量526 收藏
点赞数
文章标签： mvc asp.net string object actionlink radiobutton
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/vera514514/article/details/7793761
版权

 

MVC视图开发是通过HtmlHelper的各种扩展方法来实现的(位于System.Web.Mvc.Html下)。

主要包含以下7大类：FormExtensions、InputExtensions、LinkExtensions、SelectExtensions、TextAreaExtensions、ValidationExtensions及RenderPartialExtensions类。不仅如此，通过HtmlHelper的扩展方法还能开发更多的自定义控件(如我以后讲到的GridView等)。

FormExtensions：在视图中添加表单和表单路由，分别是BeginForm、BeginRouteForm和EndForm。BeginForm用于定义表单的开始部分，重载方法如下：


BeginForm();
BeginForm(object routeValues);
BeginForm(RouteValueDictionary routeValues);
BeginForm(string actionName,string controllerName);
BeginForm(string actionName,string controllerName,object routeValues);
BeginForm(string actionName,string controllerName,RouteValueDictionary routeValues);
BeginForm(string actionName,string controllerName,FormMethod method);
BeginForm(string actionName,string controllerName,object routeValues,FormMethod method);
BeginForm(string actionName,string controllerName,RouteValueDictionary routeVaues,FormMethod method);
BeginForm(string actionName,string controllerName,FormMethod method,object htmlAttributes);
BeginForm(string actionName,string controllerName,FormMethod method,IDictionary<string,object> htmlAttributes);
BeginForm(string actionName,string controllerName,object routeValues,FormMethod method,object htmlAttributes);
BeginForm(string actionName,string controllerName,RouteValueDictionary routeValues,FormMethod method,IDictionary<string,object> htmlAttributes);

可以通过以下代码设置路由对象：

Html.BeginForm(new { controller = "blog", action = "show", author = "miracle" })
对应生成的HTML代码(默认提交方法为post)：

<form action="/blog/show/miracle" method="post"/>
也可以通过BeginForm设置提交方法，以FormMethod为最高优先级，然后才是属性设置。

Html.BeginForm("show", "blog", FormMethod.Post, new { method = "get" })
对应生成的HTML代码(尽管后面又对方法进行了更改，但是以FormMethod优先级最高，提交方法仍然为post)：

<form action="/blog/show" method="post"/>
还可以设置属性(例如id,class等)，如同时在属性中设置了action，则以属性设置为最高优先级。

Html.BeginForm("show", "blog",
                 new RouteValueDictionary { { "author", "miracle" } },
                 FormMethod.Post,
                 new RouteValueDictionary { { "action", "compose" }, { "class", "begin-form" } })
对应生成的HTML代码(添加了class，同时更改了action)：

<form action="/blog/show/miracle" class="begin-form" method="post"/>
同时，也可以利用BeginRouteForm来定义form开头部分，不过不同的是，此时不用强制指定controller(当前也可以指定)，默认当前页面所在的目录对应的控制器。重载方法如下：


BeginRouteForm(object routeValues);
BeginRouteForm(RouteValueDictionary routeValues);
BeginRouteForm(string routeName);
BeginRouteForm(string routeName,object routeValues);
BeginRouteForm(string routeName,RouteValueDictionary routeValues);
BeginRouteForm(string routeName,FormMethod method);
BeginRouteForm(string routeName,object routeValues,FormMethod method);
BeginRouteForm(string routeName,RouteValueDictionary routeValues,FormMethod method);
BeginRouteForm(string routeName,FormMethod method,object htmlAttributes);
BeginRouteForm(string routeName,FormMethod method,IDictionary<string,object> htmlAttributes);
BeginRouteForm(string routeName,object routeValues,FormMethod method,object htmlAttributes);
BeginRouteForm(string routeName,RouteValueDictionary routeValues,FormMethod method,IDictionary<string,object> htmlAttributes);

可以通过以下代码设置路由对象：

Html.BeginRouteForm(new { action="show"})
对应生成的HTML代码(尽管没有指定controller)：

<form action="/blog/show" method="post"/>
其他的设置与BeginForm类似。可通过EndForm定义结尾部分，不过一般在实际项目中，使用using来定义form而不是调用Html.EndForm。

<% using (Html.BeginForm(new { controller = "blog", action = "show", author = "miracle" }))
  {%>
  表单内容
<%} %>
    InputExtensions：包含设置CheckBox、RadioButton、Hidden、TextBox及Password控件。

首先来看CheckBox控件，重载方法列表：

CheckBox(string name);
CheckBox(string name,bool isChecked);
CheckBox(string name,bool isChecked,object htmlAttributes);
CheckBox(string name,object htmlAttributes);
CheckBox(string name,IDictionary<string,object> htmlAttributes);
CheckBox(string name,bool isChecked,IDictionary<string,object> htmlAttributes);
我们来看看对应的页面代码：


<%using (Html.BeginForm("CheckBox", "Control"))
  {%>
<fieldset>
    <legend>设置字体</legend>
    <%=Html.CheckBox("chkBlack", true, new  { id="chkBlack"})%>
    <label for="chkBlack">
        黑色</label>
    <%=Html.CheckBox("chkBlue", false, new { id = "chkBlue" })%>
    <label for="chkBlue">
        蓝色</label>
</fieldset>
<%} %>

对应生成的HTML代码：


<form action="/Control/CheckBox" method="post">
    <fieldset>
        <legend>设置字体</legend>
        <input checked="checked" id="chkBlack" name="chkBlack" type="checkbox" value="true" />
        <input name="chkBlack" type="hidden" value="false" />
        <label for="chkBlack">
            黑色</label>
        <input id="chkBlue" name="chkBlue" type="checkbox" value="true" />
        <input name="chkBlue" type="hidden" value="false" />
        <label for="chkBlue">
            蓝色</label>
    </fieldset>
</form>

我们可以看出，每一个CheckBox都会对应另外生成一个隐藏控件，可以利用它来检测复选框的选中状态。


public ActionResult ShowCheckBox(FormCollection form)
{
    bool isCheckedBlack = form["chkBlack"].Contains("true");
    bool isCheckedBlue = form["chkBlue"].Contains("true");
    ViewData["Black"] = isCheckedBlack;
    ViewData["Blue"] = isCheckedBlue;
    return View();
}

接下来看看单选控件RadioButton，重载方法列表：

RadioButton(string name,object value);
RadioButton(string name,object value,object htmlAttributes);
RadioButton(string name,object value,IDictionary<string,object> htmlAttributes);
RadioButton(string name,object value,bool isChecked);
RadioButton(string name,object value,bool isChecked,object htmlAttributes);
RadioButton(string name,object value,bool isChecked,IDictionary<string,object> htmlAttributes);

<%using (Html.BeginForm("RadioButton", "Control"))
  {%>
<fieldset>
    <legend>设置字体</legend>
    <%=Html.RadioButton("color", "black", true, new { id = "rbBlack" })%>
    <label for="rbBlack">
        黑色</label>
    <%=Html.RadioButton("color", "blue", false, new { id = "rbBlue" })%>
    <label for="rbBlue">
        蓝色</label>
</fieldset>
<%} %>


<form action="/Control/RadioButton" method="post">
<fieldset>
    <legend>设置字体</legend>
    <input checked="checked" id="rbBlack" name="color" type="radio" value="black" />
    <label for="rbBlack">
        黑色</label>
    <input id="rbBlue" name="color" type="radio" value="blue" />
    <label for="rbBlue">
        蓝色</label>
</fieldset>
</form>

我们可以发现RadioButton的name值是一样的，保证单选的唯一性。同时不需要额外的隐藏控件来保存是否选中。
接下来看看隐藏控件是如何实现的：

Hidden(string name);
Hidden(string name,object value);
Hidden(string name,object value,object htmlAttributes);
Hidden(string name,object value,IDictionary<string,object> htmlAttributes);
生成的隐藏控件及HTML代码如下：

Html.Hidden("name", "miracle");
<input id="name" name="name" type="hidden" value="miracle" />
由于文本框及密码的生成方式与Hidden类似，这里就不再介绍了。

     LinkExtensions：在视图中设置链接，包含ActionLink和RouteLink。两者基本功能一致，只是后者可以指定路由名称而已。

我们以ActionLink为例来讲解，重载方法列表：


ActionLink(string linkText,string actionName);
ActionLink(string linkText,string actionName,object routeValues);
ActionLink(string linkText,string actionName,object routeValues,object htmlAttributes);
ActionLink(string linkText,string actionName,RouteValueDictionary routeValues);
ActionLink(string linkText,string actionName,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);
ActionLink(string linkText,string actionName,string controller);
ActionLink(string linkText,string actionName,string controller,object routeValues,object htmlAttributes);
ActionLink(string linkText,string actionName,string controller,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);
ActionLink(string linkText,string actionName,string controller,string protocol,string hostName,string fragment,object routeValues,object htmlAttributes);
ActionLink(string linkText,string actionName,string controller,string protocol,string hostName,string fragment,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);

Html.ActionLink("Miracle's Blog", "Show", "Blog")
<a href="/Blog/Show">Miracle's Blog</a>
在这里，简单的列举一下RouteLink的相关方法:


RouteLink(string linkText,object routeValues);
RouteLink(string linkText,RouteValueDictionary routeValues);
RouteLink(string linkText,string routeName,object routeValues);
RouteLink(string linkText,string routeName,RouteValueDictionary routeValues);
RouteLink(string linkText,object routeValues,object htmlAttributes);
RouteLink(string linkText,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);
RouteLink(string linkText,string routeName,object routeValues,object htmlAttributes);
RouteLink(string linkText,string routeName,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);
RouteLink(string linkText,string routeName,string protocol,string hostName,string fragment,object routeValues,object htmlAttributes);
RouteLink(string linkText,string routeName,string protocol,string hostName,string fragment,RouteValueDictionary routeValues,IDictionary<string,object> htmlAttributes);

Html.RouteLink("Miracle's Blog", "default", new { author="miracle"})
<a href="/Blog/Show/miracle">Miracle's Blog</a>
   SelectExtensions：包含DropDownList和ListBox控件。前者为下拉列表，后者为列表框。

DropDownList下拉列表的重载方法列表：


DropDownList(string name);
DropDownList(string name,string optionLabel);
DropDownList(string name,IEnumerable<SelectListItem> selectList,string optionLabel);
DropDownList(string name,IEnumerable<SelectListItem> selectList,string optionLabel,object htmlAttributes);
DropDownList(string name,IEnumerable<SelectListItem> selectList);
DropDownList(string name,IEnumerable<SelectListItem> selectList,object htmlAttributes);
DropDownList(string name,IEnumerable<SelectListItem> selectList,IDictionary<string,object> htmlAttributes);
DropDownList(string name,IEnumerable<SelectListItem> selectList,string optionLabel,IDictionary<string,object> htmlAttributes);

查看一下DropDownList应用页面及HTML：

public ActionResult ShowDropDownList()
{
    ViewData["Category"] = new SelectList(db.Categories, "CategoryID", "CategoryName");
    return View();
}

<%using (Html.BeginForm("SelectDropDownList", "Control"))
  {%>
<fieldset>
    <legend>选择类别</legend>
    <%=Html.DropDownList("Category")%>
    <input type="submit" value="选择"/>
</fieldset>
<%} %>

<form action="/Control/SelectDropDownList" method="post">
<fieldset>
<legend>选择产品类别</legend>
    <select id="Category" name="Category">
        <option value="1">Beverages</option>
        <option value="2">Condiments</option>
        <option value="3">Confections</option>
        <option value="4">Dairy Products</option>
        <option value="5">Grains/Cereals</option>
        <option value="6">Meat/Poultry</option>
        <option value="7">Produce</option>
        <option value="8">Seafood</option>
    </select>
    <input type="submit" value="选择"/></fieldset>
</form>

要获取当前选中的项，代码如下：

public ActionResult SelectDropDownList(FormCollection form)
{
    var selectedCategories = form["Category"];
    ViewData["SelectCategory"] = new SelectList(db.Categories, "CategoryID", "CategoryName", selectedCategories);
    return View();
}

<%using (Html.BeginForm("ShowDropDownList", "Control"))
{%>
    <fieldset>
        <legend>当前选中类别</legend>
        <%=Html.DropDownList("SelectCategory")%>
        <input type="submit" value="返回"/>
    </fieldset>
<%} %>

<form action="/" method="post">
<fieldset>
    <legend>当前选中类别</legend>
    <select id="SelectCategory" name="SelectCategory">
        <option value="1">Beverages</option>
        <option value="2">Condiments</option>
        <option value="3">Confections</option>
        <option value="4">Dairy Products</option>
        <option value="5">Grains/Cereals</option>
        <option value="6">Meat/Poultry</option>
        <option value="7">Produce</option>
        <option selected="selected" value="8">Seafood</option>
    </select>
    <input type="submit" value="返回"/>
</fieldset>
</form>

ListBox列表框可选中多个项(设置multiple)：

ListBox(string name);
ListBox(string name,IEnumerable<SelectListItem> selectList);
ListBox(string name,IEnumerable<SelectListItem> selectList,object htmlAttributes);
ListBox(string name,IEnumerable<SelectListItem> selectList,IDictionary<string,object> htmlAttributes);
查看一下ListBox应用页面及HTML：

public ActionResult ShowListBox()
{
    ViewData["Category"] = new SelectList(db.Categories, "CategoryID", "CategoryName");
    return View();
}

<%using (Html.BeginForm("SelectListBox", "Control"))
  {%>
<fieldset>
    <legend>选择类别</legend>
    <%=Html.ListBox("Category")%>
    <input type="submit" value="选择"/>
</fieldset>
<%} %>

<form action="/Control/SelectListBox" method="post">
<fieldset>
    <legend>选择类别</legend>
    <select id="Category" multiple="multiple" name="Category">
        <option value="1">Beverages</option>
        <option value="2">Condiments</option>
        <option value="3">Confections</option>
        <option value="4">Dairy Products</option>
        <option value="5">Grains/Cereals</option>
        <option value="6">Meat/Poultry</option>
        <option value="7">Produce</option>
        <option value="8">Seafood</option>
    </select>
    <input type="submit" value="选择"/>
</fieldset>
</form>

当选中多项时，代码如下：


public ActionResult SelectListBox(FormCollection form)
{
    var selectedCategories = form["Category"].Split(',').AsEnumerable();
    ViewData["SelectCategory"] = new MultiSelectList(db.Categories, "CategoryID", "CategoryName", selectedCategories);
    return View();
}


<%using (Html.BeginForm("ShowListBox", "Control"))
  {%>
<fieldset>
    <legend>当前选中类别</legend>
    <%=Html.ListBox("SelectCategory")%>
    <input type="submit" value="返回"/>
</fieldset>
<%} %>

<form action="/" method="post">
<fieldset>
    <legend>当前选中类别</legend>
    <select id="SelectCategory" multiple="multiple" name="SelectCategory">
        <option value="1">Beverages</option>
        <option selected="selected" value="2">Condiments</option>
        <option selected="selected" value="3">Confections</option>
        <option value="4">Dairy Products</option>
        <option value="5">Grains/Cereals</option>
        <option value="6">Meat/Poultry</option>
        <option value="7">Produce</option>
        <option value="8">Seafood</option>
    </select>
    <input type="submit" value="返回"/>
</fieldset>
</form>

夏小安Lily
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
YQBlog - 基于Asp.Net MVC3 EF4.0技术的个人博客系统
10-30
YQBlog - 基于Asp.Net MVC3 EF4.0技术的个人博客系统。 网站结构： 权限：.net membership 文章分类：category.js（json格式存储） 文章内容：表 blog_article，blog_articledetail 以及 视图 blog_varticle ...
Westwind.Web.Markdown：对ASP.NET WebForms和MVC应用程序的Markdown支持
02-04
西风网站对基于System.Web的ASP.NET WebForms和MVC应用程序的Markdown支持从NuGet获取它要使用该控件，您可以从安装： PS > install-package Westwind.Web.Markdown产品特点该库提供： Markdown解析器功能使用...
9.HtmlHelper
祈离的专栏
04-19 783
许多时候我们会遇到如下场景在写一个编辑数据的页面时，我们通常会写如下代码   1: input type="text" value= name="title" />由前篇我们所讲的Helper演化，我们思考，对于这种代码我们是不是也可以用一个Helper来自动绑定数据呢这当然是可以的，ASP.NET MVC提供了一个HtmlHelper用于生成有数据绑定的Html标签。1.
MVC部份属性验证控件
weixin_34388207的博客
02-04 81
http://msdn.microsoft.com/en-us/library/system.componentmodel.dataannotations.displayattribute.aspx   The System.ComponentModel.DataAnnotations namespace provides attribute classes that are used...
Mvc中设置控件属性
weixin_30745553的博客
09-27 103
例： @Html.TextBox(“HTML Control的名”,”這個TextBox的值”, HTML 特性設定/htmlAttributes new{ disabled=”true”}) 样例： @Html.TextBox("sendid", Model.Name, new { @readonly = "true" }) 第三个参数 直接设置控件属性 转载于:...
MVC_HtmlHelper用法大全
weixin_33883178的博客
11-03 69
许多时候我们会遇到如下场景在写一个编辑数据的页面时，我们通常会写如下代码1:<inputtype="text"value='<%=ViewData["title"] %>'name="title"/>由前篇我们所讲的Helper演化，我们思考，对于这种代码我们是不是也可以用一个Helper来自动绑定数据呢这当然是可以的，ASP.NET MVC提供了一个HtmlHelper用...
asp.net知识库
06-18
ASP.NET2.0控件一览---标准控件(1) ASP.NET2.0控件一览---标准控件(2) ASP.NET 2.0中使用webpart系列控件 ASP.NET 2.0 中实现跨页提交 新控件、管理外观、布局及其它用户体验 ASP.NET 2.0 缓存技术 （原创） asp.net...
史上最好传智播客就业班.net培训教程60G 不下会后悔
03-12
ASP.Net MVC是微软推出的区别于ASP.Net WebForm的Web开发新技术，由于ASP.Net MVC解决了ASP.Net WebForm的很多缺点，非常适合大型、中型项目的开发，一经推出就受到了.Net开发社区的追捧，很多.Net开发人员的职位...
ASP.NET MVC控件的HTML属性添加
soul的技术杂记
07-31 2316
以增加控件的maxlength属性为例，有以下几种方式： <%:Html.TextBoxFor( model => model.MailReceiver, new Dictionary() { { "size", 200 }, {"maxlength", 200}, { "
MVC 中与链接相关的辅助方法(Html.ActionLink,Html.RouteLink , Url.Action , Url.Content ,Url.RouteUrl)...
weixin_34233856的博客
10-24 225
Html.ActionLink与Url.Action 1.两者者是根据给定的Controller,Action 生成链接， 但是Html.ActionLink 返回的是MvcHtmlString的一个带<a>标签的超链接, 而Url.Action返回的是string，一个根本Controller,Action生成的URL地址， 比Html.ActionLink少了<...
ASP.NET教务管理平台-权限及公共模块设计与开发
大叔_爱编程 的博客
04-23 804
Visual Studio 2005 是一系列高效的、智能的开发工具的统称，它拥有一个庞大的产品线，包括面向学生、爱好者、初学者的Express版，面向专家、Visual Basic 6的Standard版，面向顾问、企业开发人员的Professional版和面向架构师的Team System版本。在这些版本中，有些集成了开发软件常用到的东西，比如重构、单元测试、类设计器等等，以方便开发人员快速的设计各类软件。
ASP.NET MVC企业级程序设计 (接上个作品加了添加)
Mr_wangzu的博客
04-19 873
【代码】ASP.NET MVC企业级程序设计 (接上个作品加了添加)
ASP.NET实验室预约系统的设计
大叔_爱编程 的博客
04-29 912
实验室预约系统的设计主要是基于B/S模型，在Windows系统下，运用ASP.NET平台和SQLServer2000数据库实现实验室预约功能。该设计主要实现了实验室的预约和管理功能。预约功能包括老师对实验室信息、实验项目和实验预约情况的查询以及对实验室的预约；学生对老师预约情况和实验项目预约情况的查询以及学生对实验的预约。管理功能包括教师、学生、管理员三者的登录、注册、个人资料管理，管理员对实验室的管理与对学生和教师预约信息的删除功能。最后通过调试、完善该系统，基本实现了高校实验室预约、管理功能，为各大学的
ASP.NET某企业信息管理系统的设计与实现
大叔_爱编程 的博客
04-26 1154
信息管理系统就是我们常说的MIS(Management Information System),它是一个计算机软硬件资源以及数据库的人-机系统。经过对题目和内容的分析,选用了Microsoft公司的ASP.NET开发工具,由于它提供了用于从数据库中访问数据的强大工具集,使用它可以建立开发比较完善的数据库操作应用程序,并利用SQL Server2000提供数据库。根据实际情况，使用快速原型法（Rapid Prototyping）即以少量代价快速地构造一个可执行的软件系统模型。以此为基础，搭建了系统框架，对其下
C#面：ASP.NET 与 ASP 相比，主要有哪些进步
那个那个鱼的博客
04-26 366
总结来说，C# ASP.NET 相对于ASP在语言特性、性能、功能和开发工具等方面都有较大的进步，可以更好地满足现代Web应用的需求。
分布式系统.pptx
04-29
分布式系统.pptx
源代码-360通用ASP防护代码(防sql注入).zip
最新发布
04-29
源代码-360通用ASP防护代码(防sql注入).zip
学习asp.net mvc
05-02
ASP.NET MVC 是一种 Web 应用程序开发框架，它可以帮助您创建具有模型-视图-控制器（MVC）架构的 Web 应用程序。MVC 架构将应用程序分为三个主要组件：模型（处理数据和应用程序逻辑）、视图（处理用户界面）和控制...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值