MVC中HtmlAttributes的应用

程序人生 在路上 849次浏览 0个评论

在MVC的View中,我们可以通过HtmlHelper的一些扩展方法插入一些控件,例如通过Html.TextBox插入一个文本框等等,下面是一个简单的范例
<%@ Page Title=”” Language=”C#” MasterPageFile=”~/Views/Shared/Site.Master” Inherits=”System.Web.Mvc.ViewPage” %>

<asp:Content ID=”Content1″ ContentPlaceHolderID=”TitleContent” runat=”server”>
创建相册
</asp:Content>
<asp:Content ID=”Content2″ ContentPlaceHolderID=”MainContent” runat=”server”>
<div class=”widget”>
<div class=”title”>
<div class=”icon”>
</div>
<h3>
创建新相册
</h3>
</div>
<div class=”details”>
<%using (Html.BeginForm())
{
%>
<fieldset>
<legend>基本信息</legend>
<p>
<label for=”title”>
标题:</label>
<%= Html.TextBox(“title”)%>
<%= Html.ValidationMessage(“title”) %>
</p>
<p>
<label for=”desc”>
描述:</label>
<%= Html.TextArea(“desc”)%>
<%= Html.ValidationMessage(“desc”) %>
</p>
<p>
<label for=”public”>
是否公开:</label>
<%= Html.CheckBox(“public”) %>
</p>

<p>
<input type=”submit” value=”提交” />
</p>
</fieldset>
<%
} %>
</div>
</div>
</asp:Content>
<asp:Content ID=”Content3″ ContentPlaceHolderID=”head” runat=”server”>
</asp:Content>
看起来不错对吧。要注意的是,这并不是控件,而是一个方法。那么,它会生成什么样的代码呢?
<div class=”details”>
<form action=”/Gallery/Create” method=”post”>
<fieldset>
<legend>基本信息</legend>
<p>
<label for=”title”>
标题:</label>
<input id=”title” name=”title” type=”text” value=”” />

</p>
<p>
<label for=”desc”>
描述:</label>
<textarea cols=”20″ id=”desc” name=”desc” rows=”2″>
</textarea>

</p>
<p>
<label for=”public”>
是否公开:</label>
<input id=”public” name=”public” type=”checkbox” value=”true” /><input name=”public” type=”hidden” value=”false” />
</p>

<p>
<input type=”submit” value=”提交” />
</p>
</fieldset>
</form>
</div>
我们看到,它是生成标准的HTML控件。
那么如果我们需要对该控件进行定义呢?例如设置宽度,颜色等等,怎么办呢?这就是所谓的htmlAttributes起作用的地方。请注意下面粗体的部分
<%@ Page Title=”” Language=”C#” MasterPageFile=”~/Views/Shared/Site.Master” Inherits=”System.Web.Mvc.ViewPage” %>

<asp:Content ID=”Content1″ ContentPlaceHolderID=”TitleContent” runat=”server”>
创建相册
</asp:Content>
<asp:Content ID=”Content2″ ContentPlaceHolderID=”MainContent” runat=”server”>
<div class=”widget”>
<div class=”title”>
<div class=”icon”>
</div>
<h3>
创建新相册
</h3>
</div>
<div class=”details”>
<%using (Html.BeginForm())
{
%>
<fieldset>
<legend>基本信息</legend>
<p>
<label for=”title”>
标题:</label>
<%= Html.TextBox(“title”, “初始值”, new { width = “400px”, style = “background-color:red” })%>
<%= Html.ValidationMessage(“title”) %>
</p>
<p>
<label for=”desc”>
描述:</label>
<%= Html.TextArea(“desc”)%>
<%= Html.ValidationMessage(“desc”) %>
</p>
<p>
<label for=”public”>
是否公开:</label>
<%= Html.CheckBox(“public”) %>
</p>

<p>
<input type=”submit” value=”提交” />
</p>
</fieldset>
<%
} %>
</div>
</div>
</asp:Content>
<asp:Content ID=”Content3″ ContentPlaceHolderID=”head” runat=”server”>
</asp:Content>
也就是说,我们可以通过匿名类型的方式任意构造出来一些属性。当然,这些都是Input标签默认就支持的属性。事实上,哪怕不支持也没有关系,直接写不会出错的。
那么,如果我们希望添加一个css类的绑定呢,要特别注意一下,因为class是一个c#关键字,你可能需要下面这样指定
<%= Html.TextArea(“desc”, “初始值”, new { @class = “myclass” })%>
也就是说,要通过一个@进行转义。


CodeBye 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明MVC中HtmlAttributes的应用
喜欢 (0)or分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址