Asp.net MVC2.0系列文章-添加操作
此篇文章，我们将实现MVC2.0的添加操作，主要包括Model的创建、View的Edit操作和Control的Create操作。
创建数据模型Model
数据模型主要包括数据信息、验证规则以及业务逻辑。
创建Model的方式有多种,可以使用微软的ADO.NET Entity Data Model，也可以使用第三方工具生成实体对象，对于比较简单的实体，我们可以手工添加，此处就是手动敲上去的。
分析：此处定义了新闻实体对象的的一些属性，在每个Property上都存在一些注解，比如字段Title上RequiredAttribute，表明Title栏位是必填字段，如果不填写会显示错误信息”请输入标题！”
DataTypeAttribute属性表明此字段的数据类型为文本类型，它是个枚举类型集合，如下：
| Member name
|
Description
|
| Custom
|
Represents a custom data type.
|
| DateTime
|
Represents an instant in time, expressed as a date and time of day.
|
| Date
|
Represents a date value.
|
| Time
|
Represents a time value.
|
| Duration
|
Represents a continuous time during which an object exists.
|
| PhoneNumber
|
Represents a phone number value.
|
| Currency
|
Represents a currency value.
|
| Text
|
Represents text that is displayed.
|
| Html
|
Represents an HTML file.
|
| MultilineText
|
Represents multi-line text.
|
| EmailAddress
|
Represents an e-mail address.
|
| Password
|
Represent a password value.
|
| Url
|
Represents a URL value.
|
| ImageUrl
|
Represents a URL to an image.
|
这些类型，可以分别试试，看看最终效果什么样子的。
DisplayNameAttribute属性表明了此字段要文字说明。
创建View视图
MVC提供了生成View的向导工具，很方便的，如下图流程步骤：
我们在View文件夹下，新建一个新文件夹，命名为News
右击News文件夹，选择Add->Add View功能菜单，出现如下界面：
在View name栏位，我可以给此视图修改名称，比如AddNews，
选中Create a strongly-typed view 栏位，选择刚才定义的实体类Model，并选择View content栏位为Create操作。
其他栏位默认值就OK
最终效果如下图所示：
单击【Add】按钮，即可添加AddNews.aspx视图成功。此文件的核心代码如下所示：
| <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>
添¬¨ª加¨®新?闻?</h2>
<% using (Html.BeginForm())
{%>
<%: Html.ValidationSummary(true) %>
<fieldset>
<legend>新?闻?</legend>
<div class="editor-label">
<%: Html.LabelFor(model => model.Title) %>
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.Title) %>
<%: Html.ValidationMessageFor(model => model.Title) %>
</div>
<div class="editor-label">
<%: Html.LabelFor(model => model.CreateTime) %>
</div>
<div class="editor-field">
<%: Html.TextBoxFor(model => model.CreateTime, new { @class = "date" })%>
<%: Html.ValidationMessageFor(model => model.CreateTime) %>
</div>
<div class="editor-label">
<%: Html.LabelFor(model => model.Content) %>
</div>
<div class="editor-field">
<%: Html.EditorFor(model => model.Content) %>
<%: Html.ValidationMessageFor(model => model.Content) %>
</div>
<p>
<input type="submit" value="添¬¨ª加¨®" />
</p>
</fieldset>
<% } %>
<div>
<%: Html.ActionLink("Back to List", "Index","Home") %>
</div>
</asp:Content>
|
分析：
在日期文本框中，新增加属性new { @class = "date" })，此Class属性是为了稍后的日历控件的显示。要使日期文本框显示日期控件，可以使用Jquery UI，方法是：
1/、Jquery UI官方网站http://www.jqueryUI.com下载最新的 UI类库
2、添加日历控件的CSS文件和JS文件到项目中，如下图
3、在母版页面Site.Master中添加JS的引用，以及页面初始化时绑定日历控件到文本框，代码如下：
| <link href="http://www.cnblogs.com/Content/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script src="http://www.cnblogs.com/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="http://www.cnblogs.com/Scripts/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input:text.date").datepicker(
{
dateFormat: "yy-mm-dd"
});
});
</script>
|
到此，日历栏位的文本框就可以显示日历控件了，稍后看效果图。
创建Controller文件
在Controllers文件夹下，新增News文件夹；
单击右键，选择Add->Controller，显示如下界面
重命名Controller Name栏位为NewsController，同时选择下方的复选框，最终效果如下图：
单击【Add】按钮，自动产生Controller中的一些方法，这时候对Controller中的方法做一些修改，即可完成添加新闻页面初始化的方法，以及添加新闻功能，代码如下：
| // GET: /News/Create
//完成页面初始化
public ActionResult AddNews()
{
return View();
}
//
// POST: /News/Create
//完成添加按钮事件
[HttpPost]
public ActionResult AddNews(THelperMVC.Models.News.AddNewsModel news)
{
if (ModelState.IsValid)
{
newsService.AddNews();
return RedirectToAction("index", "Home");
}
else
{
ModelState.AddModelError("", "请?输º?入¨?合?法¤¡§的Ì?信?息¡é！ê?");
}
return View(news);
}
|
至此，MVC的各个层次都已经创建完，让我们看看最终的效果吧。
程序效果图
