上一节我们使用原始的HTML表单来完成留言功能,但是ASP.NET MVC提供了丰富的HTML辅助方法来帮助我们构建更简洁优雅的表单。

Step 1. 修改Form标签

首先,我们可以使用Html.BeginForm来创建form标签。这样我们可以将原来的表单改成如下代码。

    @{Html.BeginForm("Save", "Home"); }
<label for="nickname">昵称</label>
<input name="nickname" type="text" />
<br /><br />
<label for="content">内容</label>
<textarea name="content" cols="50" rows="5" ></textarea>
<br /><br />
<input type="submit" value="提交" />
@{Html.EndForm();}

这里使用的Html.BeginForm方法的原型是Html.BeginForm(string actionName,string controllerName)。之前代码<form action="/Home/Save" method="post">中action的值是写死在Html里面的,原本这样做并没有什么问题,可是在ASP.NET MVC中网址Url是可以通过路由规则修改的,写死了对我们后期修改不利,使用这个辅助方法的好处是避免这一点。注意Html.BeginForm和Html.EndForm我们要语句方式调用,所以要加“;”和大括号。当然这样会显得不简洁,所以通常可以使用using语句,如下。

    @using (Html.BeginForm("Save", "Home"))
{
<label for="nickname">昵称</label>
<input name="nickname" type="text" />
<br /><br />
<label for="content">内容</label>
<textarea name="content" cols="50" rows="5" ></textarea>
<br /><br />
<input type="submit" value="提交" />
}

Step 2. 改进表单标签

表单中的label标签和input标签同样可以改用Html辅助方法,来看代码。

    @using (Html.BeginForm("Save", "Home"))
{
@Html.Label("nickname","昵称")
@Html.TextBox("
nickname")
<br /><br />
@Html.Label("content","内容")
@Html.TextArea("content", "",5,50,null)
<br /><br />
<input type="submit" value="提交" />
}

Html.Label和Html.TextBox可以生成之前表单近乎相同的HTML标签。表单标签我们都可以使用Html辅助方法,它们之间的对应关系见下表。

<label> Html.Label
<input type="text"> Html.TextBox
<textarea> Html.TextArea
<select>

Html.DropDownList和Html.ListBox

<input type="hidden"> Html.Hidden
<input type="password> Html.Password
<input type="radio"> Html.RadioButton
<input type="checkbox"> Html.CheckBox

可见Html辅助方法可以让我们使用原本在ASP.NET编程就熟悉的控件名称。

Step 3. 使用强类型视图

在设计Index视图的时候,我们已经了解使用强类型的好处。在Write视图同样也应该使用强类型。

首先在Write视图顶部加上@model MessageBoard.Models.Message,接下来就可以使用强类型辅助方法替换先前的辅助方法。强类型辅助方法名称是辅助方法名加上后缀“For”,如Html.Label的强类型是Html.LabelFor。替换后的代码如下。

@model MessageBoard.Models.Message

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Write</title>
</head>
<body>
<h1>MVC留言板</h1>
@using (Html.BeginForm("Save", "Home"))
{
@Html.LabelFor(m=>m.NickName,"昵称")
@Html.TextBoxFor(m => m.NickName)
<br /><br />
@Html.LabelFor(m => m.Content,"内容")
@Html.TextAreaFor(m => m.Content,5,50,null)
<br /><br />
<input type="submit" value="提交" />
}
</body>
</html>

强类型Html辅助方法使用lambda表达式来代替name字符串,这样做主要有两个好处:一是写代码时可以有代码提示;二是代码重构的时候可以自动修改。所以强类型Html辅助方法是我们主要构建表单的方式。

ASP.NET MVC轻教程 Step By Step 6——改进表单的更多相关文章

  1. 【ASP.NET Web API教程】5.3 发送HTML表单数据:文件上传与多部分MIME

    原文:[ASP.NET Web API教程]5.3 发送HTML表单数据:文件上传与多部分MIME 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面 ...

  2. 【ASP.NET Web API教程】5.2 发送HTML表单数据:URL编码的表单数据

    原文:[ASP.NET Web API教程]5.2 发送HTML表单数据:URL编码的表单数据 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内 ...

  3. ASP.NET MVC轻教程 Step By Step 1 ——入门

    使用ASP.NET MVC有一段时间了,本人还是非常喜欢ASP.NET MVC这个框架模式的.在经历了WebForm复杂粗暴的做法后,自然感觉简洁优雅的MVC清新可人,只不过WebForm和MVC的设 ...

  4. ASP.NET MVC轻教程 Step By Step 8——路由

    在前面的教程里,细心的你可能会有个疑问,就是地址栏输入/Home/Write就可以进入留言页面.无论是静态HTML还是ASP/ASP.NET.PHP,URL都是和某个页面相关.比如假设有个URL是“w ...

  5. ASP.NET MVC轻教程 Step By Step 13——页面布局

    一般在一个网站中页面会使用相同的结构和元素,如果每个页面都要重复添加这些元素,不仅繁琐更会给我们后期维护带来大麻烦.所以我们采用网页模板之类的技术,将固定不变的元素放入模板,同时留下一些占位符供页面各 ...

  6. ASP.NET MVC轻教程 Step By Step 12——客户端验证

    前面两节使用的两种数据验证方法都是在服务器端进行的,也就是提交了表单,数据回传给服务器才能验证.这样会带来两个问题,一是用户体验不好,用户提交了表单之后才知道存在问题:二是会给服务器带来额外的压力.我 ...

  7. ASP.NET MVC轻教程 Step By Step 9——分页

    现在我们要把Index视图的留言信息进行分页显示. Step 1. 创建路由 我们希望以类似地址http://localhost:41583/Page1来表示第一页,Page2表示第二页,以此类推.在 ...

  8. ASP.NET MVC轻教程 Step By Step 7——改进Write动作方法

    在上一节我们使用强类型视图改进Write视图获得更好的智能感知和代码重构,现在可以进一步的改进动作方法. Step 1. 数据模型绑定 在Save方法中我们使用Request来获取表单传送的值,其实可 ...

  9. ASP.NET MVC轻教程 Step By Step 2 ——View初探

    在上一节我们完成了一个最简化的MVC程序,最重要的是下面这段代码. public class HomeController : Controller { public string Index() { ...

随机推荐

  1. QinQ封装及终结详解

    以下内容摘自正在当当网.京东网.卓越网.互动出版网预售,即将正式发售的<华为交换机学习指南>一书(全书近千页).本书是由华为官方授权,国内第一本,也是唯一一本华为交换机权威学习指南,是华为 ...

  2. Zend Framework 2参考Zend\Authentication(HTTP认证适配器)

    Zend Framework 2参考Zend\Authentication(HTTP认证适配器) 介绍 Zend\Authentication\Adapter\Http提供了RFC-2617, Bas ...

  3. android关机充电

    1.关机充电其实是进入adb shell很快的方式! 2.手机关机时候插入USB,手机将进入关机充电模式,那么这个模式究竟是怎么进行的,这里分析如下! (1)uboot:这里代码大概浏览了一下:u-b ...

  4. C#实现FTP文件夹下载功能【转载】

    网上有很多FTP单个文件下载的方法,前段时间需要用到一个FTP文件夹下载的功能,于是找了下网上的相关资料结合MSDN实现了一段FTP文件夹下载的代码. 实现的思路主要是通过遍历获得文件夹下的所有文件, ...

  5. XRDP与VNC的关系

    如果仅仅安装XRDP协议.是不能在windows上使用远程桌面连接到Ubuntu. 还须要安装VNCServer才行. 所以,XRDP启动之后.系统会自己主动启动一个VNC会话进程监听服务. 当我们通 ...

  6. xshell十大技巧

    xshell是我用过的最好用的ssh客户端工具,没有之一.这个软件完全免费,简单易用,可以满足通过ssh管理linux vps所有需要,唯一遗憾的是没有官方中文版. 警告:不要下载所谓的汉化版,可能有 ...

  7. apache kafka技术分享系列(目录索引)--转载

    原文地址:http://blog.csdn.net/lizhitao/article/details/39499283 kafka开发与管理: 1)apache kafka消息服务 2)kafak安装 ...

  8. Effective C++ 笔记二 构造/析构/赋值运算

    条款05:了解C++默默编写并调用哪些函数 编译器默认声明一个default构造函数.一个copy构造函数.一个copy assignment操作符和一个析构函数.这些函数都是public且inlin ...

  9. 大数据应用:五大地区喜新厌旧游戏APP类别之比较与分析

    今天,我们来分享点不一样的资讯.....游戏APP之喜新厌旧排行榜!! 前阵子笔者开发了一套系统可以用来收集亚洲五大地区上架APP的每日排名信息,希望观察出五大地区在APP上的喜好和使用程度之间的相异 ...

  10. 网页版 treeview使用中遇到的问题

    <div class="ScrollBar" id="ItemsTree"></div> var cla = $("#Item ...