ASP.NET入门教程（五）发表文章
本部分主要学习文章的发表、表单数据验证、百度富文本编辑器的使用。
一、创建发表文章视图模型
1. 在Models文件夹下，新建ArticleCreateViewModel类，内容如下：
using System.ComponentModel.DataAnnotations;namespace MyStudy.Models{ public class ArticleCreateViewModel { [Display(Name ="文章标题")] public string title { get; set; } [Display(Name ="作者")] public string author { get; set; } [Display(Name ="文章内容")] public string content { get; set; } }} 二、创建发表文章视图
1.在Article控制器的第一个Create方法中，右键点击，添加视图
然后点击添加即可，将以下代码删除
Create
ArticleCreateViewModel
三、百度富文本编辑器的使用
1.从百度官网下载富文本编辑器
http://ueditor.baidu.com/website/
2.解压文件，将其中的utf8-net文件夹复制到项目的根目录下（注意一定要是根目录下），复制后，将无法看到其中的文件，
然后点击
（显示所有文件），显示所有文件，选中utf8-net下所有的文件与文件夹，右键点击，选择包括在项目中，即可。
3.修改视图页，使用富文本编辑器
修改以下代码
@Html.LabelFor(model => model.content, htmlAttributes: new { @class = "control-label col-md-2" })@Html.EditorFor(model => model.content, new { htmlAttributes = new { @class = "form-control" } }) @Html.ValidationMessageFor(model => model.content, "", new { @class = "text-danger" })
修改后的结果如下所示：
@Html.LabelFor(model => model.content, htmlAttributes: new { @class = "control-label col-md-2" })@Html.TextAreaFor(model=>model.content) @Html.ValidationMessageFor(model => model.content, "", new { @class = "text-danger" })
添加如下JS代码
@section Scripts { @Scripts.Render("~/bundles/jqueryval") } 完成后页面效果如下所示
4.配置富文本编辑器，修改其图像上传等功能。
修改ueditor.config.js文件，修改内容如下
* 因此，UEditor提供了针对不同页面的编辑器可单独配置的根路径，具体来说，在需要实例化编辑器的页面最顶部写上如下代码即可。当然，需要令此处的URL等于对应的配置。 * window.UEDITOR_HOME_URL = "/xxxx/xxxx/"; */ window.UEDITOR_HOME_URL = "/utf8-net/"; var URL = window.UEDITOR_HOME_URL || getUEBasePath();
修改net下的 config.js文件
将其中的imageUrlPrefix”:修改为/utf8-net/net即可"imageUrlPrefix": "/utf8-net/net/", /* 图片访问路径前缀 */ "imagePathFormat": "upload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */ 四、数据验证
在接收用户数据之前，要对用户输入数据的合法性进行验证，必须符合一定的要求才可以进行提交。ASP.NET MVC框架提供了强大的验证组件帮助我们完成这项工作。
1.数据验证概述
ASP.NET MVC验证注解特性定义在命名空间System.ComponentModel.DataAnnotations中，它们提供了服务器端验证的功能，当在模型的属性上使用时，框架也支持客户端验证。
如果采用Database-First方式生成的*.edmx，那么所生成的类文件会在“*.tt“文件的层级之下，T4是一种用程序代码生成程序代码的技术。当"*.edmx"有所变动时（例如，执行“从数据库更新模型”）并存储时，会重新生成T4文件，一旦T4文件被变动便会立即执行T4程序代码重新生成所有文件的内容。因此直接在T4模板生成的实体类文件上添加注解，是不可行的。可以使用部分类的方式。本实例中并未使用部分类，请参考其它相关教程。
2.常用注解
在使用之前，要引入"System.ComponentModel.DataAnnotations"命名空间
3.在ArticleCreateViewModel下配置如下：
public class ArticleCreateViewModel { [Display(Name ="文章标题")] [Required(ErrorMessage ="文章标题不能为空")] [MinLength(6,ErrorMessage ="文章标题不能少于6个字符")] [MaxLength(30,ErrorMessage ="文章标题不能超过30个字符")] public string title { get; set; } [Display(Name ="作者")] [Required(ErrorMessage = "作者不能为空")] [MaxLength(30, ErrorMessage = "作者名不能超过20个字符")] public string author { get; set; } [Display(Name ="文章内容")] [Required(ErrorMessage ="文章内容不能为空")] public string content { get; set; } } 五、接收表单的数据，并保存到数据库中
1.修改[HttpPost]注解的Create方法
[HttpPost] [ValidateAntiForgeryToken] [ValidateInput(false)] public ActionResult Create(ArticleCreateViewModel article) { if (ModelState.IsValid) { tb_article tArticle = new tb_article(); tArticle.Name = article.title; tArticle.Author = article.author; tArticle.Content = article.content; tArticle.PublishDate = DateTime.Now; db.tb_article.Add(tArticle); db.SaveChanges(); return RedirectToAction("Index"); } return View(article); } 2.说明
[HttpPost]注解表示该方法仅处理HttpPost请求
[ValidateAntiForgeryToken]表示阻止伪造的表单请求，与页面中的@Html.AntiForgeryToken()共同使用，通过该特性，可以防止跨站攻击，即用户伪造表单
[ValidateInput(false)]：表示验证输入的操作，设置为false即为不验证输入，因为我们在前端使用了百度富文本编辑器，用户输入的文本内容，会被编码成HTML代码，如果不设置为false，将不允许提交。六、测试文章的发表
但是浏览时发现文章的内容页是这样的，显示的是HTML编码，现在来修改内容页，使其可以呈现输出HTML编码。
将@Model.Content该内容修改为@Html.Raw(Model.Content)，修改后再次访问，结果如下：
