要想建立開發環境,你需要安裝Visual Studio 2008/2010 Beta 2,以及SQL Express 2005(可免費從MSDN下載下傳)和MVC 2.0架構。我把本文中的示例Web應用命名為“Employee Master Information”。
使用該應用程式,你可以輸入新員工資料,編輯現有員工資料,可以檢視特定員工資料,和從資料庫中給删除任意員工資訊。該應用程式還使用了ASP.NET的Membership Provider來建立新使用者和認證已有使用者,用戶端驗證通過JavaScript實作。

圖1
建立MVC項目、資料庫和資料模型
在此前的ASP.NET MVC 2.0文章中,我讨論過如何使用Visual Studio 2008編輯器來建立一個MVC Web應用程式。在本篇文章中我使用VS2008(.NET架構3.5)建立的項目名稱為“MyMvcSample”。建立了MVC 2.0網站後,接下來将是建立資料庫和資料模型。
圖2
右鍵點選項目的“App_Data”檔案夾,并向你的解決方案增加一個“SQL Server Database”對象。如果你的開發環境中沒有安裝“SQL Express”,你不會在“Template”視窗中看到這個選項。将SQL Express資料庫的名稱指定為MySampleDatabase.mdf,點選“Add”按鈕後,一個新資料庫将被添加到App_Data檔案夾中。現在從“View”菜單中打開“Server Explorer”;你将看到MySampleDatabase.mdf資料庫已經存在。右鍵點選該資料庫下的“Tables”對象,增加一個名為“tblEmployee”的新表。在該表中添加以下列。
EmployeeName nvarchar(100)
EmployeeSalary numeric(18, 2)
EmployeeId int (Primary Key)
Department nvarchar(100)
Age int
Skillset nvarchar(1000)
Role nvarchar(50)
對于主鍵列,你需要修改兩個屬性:将“Identity Specification”的值從“No”改為“Yes”,将“Identity Increment”從0改為1。表建立完後,增加一些示例資料以供測試用。
圖3
接下來你需要建立一個資料模型,右鍵點選“Model”檔案夾,并增加一個新條目。從模闆清單中選擇“ADO.NET Entity Data Model”。在本示例中我的模型名稱為“DataModel.edmx”。點選增加按鈕向你的解決方案添加該模型。接下來你将看到一個向導界面,它将指導你為剛才建立的模型增加資料源。選擇“Generate from Database”并點選下一步。
接下來你需要選擇合适的資料源,從清單中選擇此前建立的“MySampleDatabase.mdf”,并為該資料源指定一個名稱。在解決方案web.config檔案下的“ConnectionStrings”标簽下,你将看到一個自動生成的包含資料源名稱和連接配接字元串的條目。在本例中我的連接配接名稱是“MySampleDatabaseEntities”。接下來,檢查tblEmployee,并向你的模型提供一個命名空間名稱。
圖4
在模型建立後,在模型檢視器中打開DataModel.edmx。該檢視器将幫助你檢視模型資料源,以及模型和資料庫之間的字段映射。使用模型檢視器你還可以更改模型屬性、字段名和資料類型。這個“Employee”模型将被在Controller類中使用,來增加、編輯和删除資料庫中的員工詳細資訊。DataModel.edmx是一個ADO.NET Entity Framework對象,可以在進行插入、更新或删除資料時減少代碼編寫工作量。ADO.NET Entity Framework還支援LINQ,是以你可以在業務對象上編寫查詢類的SQL,而無需編寫存儲過程來抓取資料。
圖5
建立控制器
控制器将會用到 Microsoft.Web.Mvc.Build.dll和Microsoft.Web.Mvc.dll中的類。是以在編譯應用程式之前,應檢查上述兩個動态庫已經在你的bin檔案夾下。
對于增加、編輯、删除和檢視員工職責詳細資訊等操作,我已經在我的HomeController中增加了“Get”和“Post”函數。控制器中的每一個函數都被關聯到一個視圖(.ASPX頁面),例如為了檢視員工清單,我編寫了“Index”函數來傳回員工清單資訊,該資訊将被顯示在名為“Index.aspx”的視圖中。要想顯示某個特定員工的資料,則會調用Details函數。
Function Details(ByVal id As Integer) As ActionResult
Dim objEditEmployee = (From c In objDatabaseEntities.EmployeeSet
Where c.EmployeeId = id Select c).FirstOrDefault()
Return View(objEditEmployee)
End Function
LINQ被用來查詢業務對象和從Employee List模型中查找某個特定員工。通過使用“Return View”,這個員工對象将被發回到相應的視圖。至于建立一個新員工,我也為“Create”方法建立了“Get”和“Post”兩個版本。該方法的Get版将重定向到一個空白Employee頁面/視圖,由使用者來輸入員工詳細資訊,而Post版的“Create”函數将使用我們之前建立的Employee Model對象儲存資料庫中的員工詳細資訊。
圖6
我對Create.aspx頁面中的所有輸入字段都添加了合适的用戶端驗證代碼。如果新輸入的員工姓名已經存在,則資料不會被插入到資料庫中。
Function Create(ByVal objEmployee As Employee) As ActionResult
Try
Dim objExtEmployee = (From c In objDatabaseEntities.EmployeeSet Where
c.EmployeeName = objEmployee.EmployeeName Select c).FirstOrDefault()
If objExtEmployee Is Nothing Then
objDatabaseEntities.AddToEmployeeSet(objEmployee)
objDatabaseEntities.SaveChanges()
Return RedirectToAction("Index")
End If
Catch
Return View()
End Try
對于編輯員工詳細資訊,我也建立“Get”和“Post”版的Edit函數,不過我在HomeController本身中增加了驗證機制。如果驗證失敗的話,我會使用Modelstate.Addmodelerror()函數來向相應視圖抛出一個錯誤資訊。
Protected Sub ValidateContact(ByVal EmployeeToValidate As Employee)
If EmployeeToValidate.EmployeeName.Trim().Length = 0 Then
ModelState.AddModelError("Employee Name", "Employee name is required
field.")
If EmployeeToValidate.EmployeeId.ToString().Trim().Length = 0 Then
ModelState.AddModelError("Employee Id", "Employee Id is required field.")
If (EmployeeToValidate.Department.Length = 0) Then
ModelState.AddModelError("Employee Department", "Employee Department is
required field.")
If (EmployeeToValidate.EmployeeSalary.ToString().Length = 0) Then
ModelState.AddModelError("Employee Salary", "Employee Salary is required
If (EmployeeToValidate.Age.ToString().Length = 0) Then
ModelState.AddModelError("Employee Age", "Employee Age is required field.")
If (EmployeeToValidate.Skillset.ToString().Length = 0) Then
ModelState.AddModelError("Employee Skillset", "Employee Skillset is required
ModelState.AddModelError("Employee Role", "Employee Role is required
End Sub
在删除員工清單方面,我隻增加了一個Get版,并在視圖中增加了必要的JavaScript驗證代碼(确認資訊)。
建立視圖
在一個ASP.NET MVC應用中,所有入站的浏覽器請求都被映射到控制器行為上。控制器行為可能會傳回一個視圖。與ASP.NET頁面不一樣,MVC視圖後端沒有任何代碼。你可以通過右鍵點選控制器post函數并選擇“view”選項來建立視圖。向項目增加視圖的第二種方法是,右鍵點選你的視圖檔案夾,并增加一個新視圖。預設情況下,沒有後端代碼的.ASPX就是這些視圖。你可以在項目中增加一個.ASCX檔案和HTML檔案作為視圖。
圖7
本例中,我建立了4個不同的視圖來實作增加、編輯、列舉和顯示員工詳細資訊,它們都是強類型視圖。我使用了HTML幫助類,在視圖中建立HTML對象和驗證資訊來驗證用戶端資料項。以下代碼顯示了如何使用HTML幫助類建立一個HTML輸入控制和添加驗證。
<div class="editor-field">
<%= Html.TextBoxFor(Function(model) model.EmployeeName) %>
<%= Html.ValidationMessageFor(Function(model) model.EmployeeName) %>
</div>
我試用HTML輔助方法ActionLink來實作視圖導航,使用Html.Encode()來将“<”和“>”等特殊字元編碼成可以在網頁上正常顯示的字元。微軟推薦使用HTML.Encode()方法來防止JavaScript注入攻擊。以下是向資料庫增加一名新員工的代碼。
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>Create Employee</h2>
<%=""%>
<% Using Html.BeginForm()%>
<fieldset>
<legend>Details to Enter</legend>
<div class="editor-label">
<%=Html.LabelFor(Function(model) model.EmployeeName)%>
<%= Html.LabelFor(Function(model) model.EmployeeSalary) %>
<%= Html.TextBoxFor(Function(model) model.EmployeeSalary) %>
<%= Html.ValidationMessageFor(Function(model) model.EmployeeSalary) %>
<%= Html.LabelFor(Function(model) model.EmployeeId) %>
<%= Html.TextBoxFor(Function(model) model.EmployeeId) %>
<%= Html.ValidationMessageFor(Function(model) model.EmployeeId) %>
<%= Html.LabelFor(Function(model) model.Department) %>
<%= Html.TextBoxFor(Function(model) model.Department) %>
<%= Html.ValidationMessageFor(Function(model) model.Department) %>
<%= Html.LabelFor(Function(model) model.Age) %>
<%= Html.TextBoxFor(Function(model) model.Age) %>
<%= Html.ValidationMessageFor(Function(model) model.Age) %>
<%= Html.LabelFor(Function(model) model.Skillset) %>
<%= Html.TextBoxFor(Function(model) model.Skillset) %>
<%= Html.ValidationMessageFor(Function(model) model.Skillset) %>
<%= Html.LabelFor(Function(model) model.Role) %>
<%= Html.TextBoxFor(Function(model) model.Role) %>
<%= Html.ValidationMessageFor(Function(model) model.Role) %>
<p>
<input type="submit" value="Create" />
</p>
</fieldset>
<% End Using %>
<div>
<%=Html.ActionLink("Back to Employee List", "Index")%>
</asp:Content>
結束語
對于那些剛接觸ASP.NET Web程式設計的開發者來說,學習MVC架構并不是一件難事。MVC架構應用程式的代碼也非常容易維護。另外,開發者還可以在該架構中使用測試驅動開發方法。