Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 第一章

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 第一章

--操作数据和验证

本文链接:http://www.cnblogs.com/likeli/p/4234238.html

1、    关于HtmlHelper和UrlHelper

因为大部分的web请求的目标都是向客户端发送HTML代码。因此,Asp.Net MVC也是为我们创建HTML提供了各种帮助。除了Razor,另外还有两个最为重要的帮助类就是HtmlHelper和UrlHelper,他们作为控制器和视图的Html和Url属性暴露出来,供我们使用。

这里列举一个帮助类的例子:

1 <img src="@Url.Content("~/Content/images/1.jpg")" />
2 @Html.ActionLink("HomePage","Index","Home")

该部分代码渲染之后为:

1 <img src="/Admin/content/images/1.jpg" />
2 <a href="/Admin/Home/Index">HomePage</a>

这两个帮助类只是扩展了框架的一些附加行为。关于他们的扩展方法太多,这里无法一一列举,但之后会用到。

强调一下:HtmlHelper帮我们生成HTML代码,UrlHelper帮我们生成URL地址,所以,只要记住,当我们需要生成HTML代码或URL的时候,就该使用他们了。

2、   简单登陆实战

首先,先勾画一个登陆的风格样式,如图:

图1

建立简单的模型、控制器,并生成视图。

图2

在创建视图的时候,不用EF生成,创建空白的视图即可。

 1         public ActionResult Login()
 2         {
 3             return View();
 4         }
 5
 6         [HttpPost]
 7         public ActionResult Login(LoginModel model)
 8         {
 9             if (ModelState.IsValid)
10             {
11                 //简单验证通过
12                 return RedirecToLocal("~/Admin/Home");
13             }
14             else
15             {
16                 // 如果我们进行到这一步时某个地方出错,则重新显示表单
17                 ModelState.AddModelError("", "提供的用户名或密码不正确");
18                 return View(model);
19             }
20         }

以上代码为登陆控制器的代码。并做了简单的验证。验证通过后,跳转到指定页面。

通常设涉及到数据问题时,会有很多规则和限制可以使用,比如,字段非空,给字段设置范围区间等等。MVC中控制器可以通过操作ModelState来检查请求是否有效。

 1     public class LoginModel
 2     {
 3         [Required]
 4         [Display(Name = "用户名")]
 5         [StringLength(10, ErrorMessage = "必须至少包含{2}个字符", MinimumLength = 3)]
 6         public string UserName { get; set; }
 7
 8         [Required]
 9         [Display(Name = "密码")]
10         public string UserPwd { get; set; }
11
12         [Required]
13         [Display(Name = "记住我?")]
14         public bool RememberMe { get; set; }
15     }

关于上面的Required、Display、StringLength标记,这是为了对这个属性进行强化控制。

  • 重点一下自定义错误信息。数据标记提供了ErrorMessage属性,可以指定返回给用户的错误信息。而不是由Data Annotations API生成的默认信息。就如上面代码中定义字符长度的方法一样。

定义好错误信息后,那么现在就是需要如何显示这个错误信息了。ViewData.ModelState["UserName"]可以读取到这个错误信息,但这是一个集合,我们需要用迭代循环来显示错误信息,那么就难免要在页面上书写循环来输出错误信息。但是,现在MVC提供能更好的方法来渲染特定属性的错误信息@Html.ValidationMessageFor(string modelName),这个方法让我们省去了循环的代码。如下,一句代码即可完成该效果:@Html.ValidationMessageFor(m => m.UserName)

  • 这里再次提示一下,这里用的验证方法都是在服务端的代码验证,需要在服务器和客户端之间来来回回几次才能验证数据的有效性,那么聪明的你应该瞬间明白我要说什么了,那就是这种验证方式并不是一种节约带宽和服务器资源的好方法。但不可否认,这是一种有效的方法,可以很好的保证数据的有效性、安全性。选择性的使用即可,之后的文章里我们会优化验证方法,来避免不必要的请求,节约带宽和服务器资源。

视图中,我们需要用到HtmlHelper和UrlHelper来生成Url和HTML标记。

 1  @using (Html.BeginForm())
 2         {
 3             <div class="loginbox">
 4                 <ul>
 5                     <li>
 6                         @Html.TextBoxFor(m => m.UserName, new { @class = "loginuser", @placeholder = "请输入用户名" })
 7                         @Html.ValidationMessageFor(m => m.UserName)
 8                     </li>
 9                     <li>
10                         @Html.TextBoxFor(m => m.UserPwd, new { @class = "loginpwd", @placeholder = "请输入密码" })
11                         @Html.ValidationMessageFor(m => m.UserPwd)
12                     </li>
13                     <li>
14                         <input type="submit" class="loginbtn" name="slogin" value="登陆" />
15                         <label>
16                             @Html.CheckBoxFor(m => m.RememberMe, new { @checked = "checked"})记住密码
17                         </label>
18                         <label>
19                             <a href="javascript:;">忘记密码?</a>
20                         </label>
21                     </li>
22                 </ul>
23             </div>
24         }

3、  参考文献

《Asp.Net MVC4 Web编程》、MSDN

4、  相关下载

源代码:http://download.csdn.net/detail/a406502972/8376701

5、  后记

本文是一个漫长的过程,因为是自己在学习,所以我会精细到我所遇到的每一个问题,每一个细节,所以,写博文比较慢。

也特别希望,各位博友在阅读过程中,多多提点,一方面细化的我学习理解,也强化一下我的文档书写能力。

真诚希望我能从小菜进化到小牛再到大牛。希望阅读的博友们也能从我的学习过程中获得进步!

时间: 2024-10-23 08:18:39

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 第一章的相关文章

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 序章

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 序章 -- 新建微软实例 1.  简介 为学习MVC4而写的文章,以项目开发的角度书写.循序渐进,同时也是自己学习的过程,博文编写过程中,我会参考相关专业书籍和网站,尽量编写和描述规范的编码和原理.若是过程中有错误,请各位看官不吝啬指出! 2.  博文定位 新手教程,所以适合刚刚准备学习MVC4的博友阅读.不过会讲述很多原理,个人认为,目的是学会如何操作,但是原理也同样重要.授人以鱼不如授人以渔. 3.  初次

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 第二章

Asp.Net MVC4 + Oracle + EasyUI + Bootstrap 第二章 --使用Ajax提升网站性能 本文链接:http://www.cnblogs.com/likeli/p/4236723.html 文章集合:http://www.cnblogs.com/likeli/category/651581.html 1.  MVC的渲染部分视图 向服务器请求HTML标签来更新网页的内容,这种方法就叫“部分渲染”,这是属于Ajax的基本过程. 部分渲染技术包括了发送异步请求给服务

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(38)-Easyui-accordion+tree漂亮的菜单导航

本节主要知识点是easyui 的手风琴加树结构做菜单导航 有园友抱怨原来菜单非常难看,但是基于原有树形无限级别的设计,没有办法只能已树形展示 先来看原来的效果 改变后的效果,当然我已经做好了,最后只放出代码供大家参考,其实网上也有这方面的资料,但是不是很好用,我还是自己写了 改变后的效果 手风琴一直都是比较漂亮和受欢迎的,但是基于树多级别来说,做起来就比较麻烦,所以我这里也用了手风琴加树的模式来做 注:上面的图标都是乱添加的,并不代表意思 进入正文: 首先必须下载一些图标.可以自行百度网页小图标

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(42)-工作流设计01

原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(42)-工作流设计01 工作流在实际应用中还是比较广泛,网络中存在很多工作流的图形化插件,可以做到拉拽的工作流设计,非常简便,再配合第三方编辑器,可以直接生成表单,我没有刻意的浏览很多工作流的实际设计,我认为工作流只要有动态可修改的流转,有时可按角色,部门,上级或者职位流转即是比较好的正常工作流!这里只带给一个思路的简单工作流... 工作流其实有几种,也可以设计得很简单: 1.固定的工作流,很小的公司,

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(34)-文章发布系统①-简要分析

原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(34)-文章发布系统①-简要分析 系列目录 最新比较闲,为了学习下Android的开发构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(1)-前言与,虽然有点没有目的的学习,但还是了解了Android的基本开发构成,我还是会持续更新本系列的一些知识点的用法. 说句实在话,我很佩服那些能连续好几年每个星期都有一篇文章的人,能坚持真是一种幸福. 一张图回顾一下我们做了那

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(30)-本地化(多语言)

原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(30)-本地化(多语言) 我们的系统有时要扩展到其他国家,或者地区,需要更多的语言环境,微软提供了一些解决方案,原始我们是用js来控制的,现在不需要了. 我们只要创建简单的资源文件,通过MVC的路由设置就可以轻松的进行语言中的切换. 本节受益于:Asp.net MVC3 高级编程第121页.大家可以自行百度这本书,这应该是国内第一本中文版的MVC3.0教程 现在从项目入手吧(本节也适合其他MVC程序),

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(41)-工作流设计01

工作流在实际应用中还是比较广泛,网络中存在很多工作流的图形化插件,可以做到拉拽的工作流设计,非常简便,再配合第三方编辑器,可以直接生成表单,我没有刻意的浏览很多工作流的实际设计,我认为工作流只要有动态可修改的流转,有时可按角色,部门,上级或者职位流转即是比较好的正常工作流! 工作流其实有几种,也可以设计得很简单: 1.固定的工作流,很小的公司,很固定的流程! 2.自定义表单和字段,有时候可以校验表单 3.自定义流转的人员,即按角色流转,用户每一次提交工作流都必须在步骤中添加要转的人员 4.直接设

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(35)-文章发布系统②-构建项目

注:阅读本文,需要阅读本系列的之前文章 代码生成器下载地址(文章开头处) 接下来我们建立数据库的表和各层的代码 我们只需要两张表,文章列表(MIS_Article)和类别表(MIS_Article_Category) USE [AppDB] GO /****** Object: Table [dbo].[MIS_Article] Script Date: 05/15/2014 17:33:15 ******/ SET ANSI_NULLS ON GO SET QUOTED_IDENTIFIER

构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(36)-文章发布系统③-kindeditor使用

我相信目前国内富文本编辑器中KindEditor 属于前列,详细的中文帮助文档,简单的加载方式,可以定制的轻量级.都是系统的首选 很多文章教程有kindeditor的使用,但本文比较特别可能带有,上传文件的缩略图和水印的源码!这块也是比较复杂和备受关注的功能 一.下载编辑器 KindEditor 4.1.10 (2013-11-23) [1143KB] 官方最新版 或者: http://www.kindsoft.net/down.php 二.添加到项目 解压 kindeditor-x.x.x.z