【譯】《Pro ASP.NET MVC4 4th Edition》第二章(三)


  本文地址http://www.cnblogs.com/outtamyhead/archive/2013/03/25/2980305.html,轉載請保留本地址

說在前面:

1、由於是頭次翻譯整本書籍,所以錯誤難免,希望大家都提出來,翻譯的不好還望大家少拍磚多鼓勵。

2、該系列沒有按照原文直譯,而是加入了我的一些言語在里面(在沒有改變原意的情況下),所以大家在看的時候希望有所對照。

3、該系列每周出一或二篇博客,因為我最近很忙,一直在加班,很累的說。

4、該系列不提供原版文字,希望看原版的可以自行下載Pdf。

5、該系列省去了前面的廢話,單刀直入,講主體內容。

 

  首先很抱歉,原本打算是將剩下的部分全部翻譯完的,但是發現后面的文字太多了,所以將剩下的部分又分成了三部分來發布。

  第二章:第一個ASP.NET MVC4程序(下一)

  創建一個簡單的數據--實體應用程序

  這一章剩下的部分我們將通過創建一個簡單的數據--實體應用程序來探索更多MVC基礎功能。在這一部分我們將加快速度。我們的目的是演示MVC,所以我們將跳過一些諸如幕后是如何工作的說明。但是不用擔心---我們會在后面的章節深入的說明它們。

  設置場景

  我們假設有一個朋友她打算舉辦一個新年晚會,她要求我們設計一個網站來幫助她的訪問者可以進行電子回復。網站一共有四個關鍵要素:

 

  一個關於晚會信息的首頁

 

  一會可以RSVP的表單

 

  RSVP表單驗證,它將顯示“謝謝你”的頁面

 

  當完成RSVPs時發送郵件給晚會的主人

  在接下來的部分,我們將使用在這一章開始時創建的MVC項目然后添加上述功能。我們可以通過前面已經涉及到的內容來完成列表中的第一項--我們可以在已經存在的視圖上通過添加一些HTML內容來展現晚會的內容。清單2-7列出了我們在Views/Home/Index.cshtml中添加的內容。

清單2-7
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
@ViewBag.Greeting World (from the view)
<p>We're going to have an exciting party.<br />
(To do: sell it better. Add pictures or something.)
</p>
</div>
</body>
</html>

  我們的工作已經開始。如果你現在運行這個程序,你可以看到晚會的詳情--當然,這是給詳情預留的占位符,但是你已經知道該怎么去做了。如圖2-12

  

  

  設計一個數據模型

  MVC中,M代表着Model,並且它是應用程序中最重要的一部分。模型是對真實世界中的對象、過程及規則的描述。模型,通常稱為域模型,包含形成我們應用程序世界的C#對象(域對象)和可以讓我們維護這些對象的方法。視圖和控制器以一致的方式將這個域暴露給客戶端並且一個設計合理的MVC程序是從設計合理的模型開始的,這將是我們添加控制器和模型的重點。

  PartyInvites程序中不需要復雜的模型,但是我們將創建一個叫做GuestResponse的主域類。這個類將負責存儲、驗證和確認RSVP

 

  添加模型類

  MVC約定所有的模型類都是放在Models文件夾里。右鍵【Models】文件夾然后選擇【Add--Class】。將文件命名為GuestResponse.cs,然后點擊【Add】按鈕來創建這個類。編輯這個類使它和清單2-8一樣。

  提示:如果你沒有找到Class菜單項,可能是Visual Studio處於調試狀態。程序在運行狀態時,Visual Studio會對項目的更改有約束。

清單:2-8
namespace
PartyInvites.Models { public class GuestResponse { public string Name { get; set; } public string Email { get; set; } public string Phone { get; set; } public bool? WillAttend { get; set; } } }

  提示:你可能注意到WillAttend屬性是可為空的布爾類型,意味着它可以為truefalse或者null。我們會在“Adding Validation”部分解釋這一原理。

 

  鏈接動作方法

  我們程序的另一個需求是包含一個RSVP表單,所以我們需要在Index.cshtml上添加一個指向它的鏈接。清單2-9

清單2-9
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
@ViewBag.Greeting World (from the view)
<p>We're going to have an exciting party.<br />
(To do: sell it better. Add pictures or something.)
</p>
@Html.ActionLink("RSVP Now", "RsvpForm")
</div>
</body>

</html>

  Html.ActionLinkHTML輔助方法(Helper method)。MVC框架自帶有一個內置的輔助方法集合,它們可以方便的渲染HTML鏈接,文本框,復選框,下拉框和自定義控制。ActionLink方法需要兩個參數:第一個是在鏈接上需要顯示的文本內容,第二個是當用戶點擊鏈接時要執行的操作。我們將在第19-21章闡述HTML輔助方法。你可以看到在圖2-13中我們的鏈接已經添加好了。

  

  如果你在瀏覽器中滑動鼠標到這個鏈接上,你可以看到這個鏈接指向了http://yourserver/Home/RsvpForm  HTML.ActionLink方法會檢查我們程序中URL路由配置並得出/Home/RsvpForm是在一個叫做HomeController的控制器上調用RscpForm動作的URL。需要注意的是,不像傳統的ASP.NET應用程序,MVC中的URL沒有對應到物理文件。每個動作方法都有它自己的URL,並且MVC使用ASP.NET路由系統解析這些URL

  

  添加一個動作方法

  如果你點擊這個鏈接你會看到一個404錯誤頁面。那是因為我們還沒有添加與/Home/RsvpForm相對應的動作方法。在HomeController類中添加一個叫做RsvpForm的方法,如清單2-10所示。

清單2-10
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace PartyInvites.Controllers {
public class HomeController : Controller {
public ViewResult Index() {
int hour = DateTime.Now.Hour;
ViewBag.Greeting = hour < 12 ? "Good Morning" : "Good Afternoon";
return View();
}
public ViewResult RsvpForm() {
return View();
}
}
}

 

  添加一個強類型視圖

  我們打算給RsvpForm動作方法添加一個視圖,但是我們的做法有一些小小的不同---我們打算創建一個強類型視圖。強類型視圖意在渲染一個特定的主域類型,如果我們指定要使用的類型(在這個例子中是GuestResponse),MVC可以創造一些非常有幫助的快捷方式來使它變得簡單。

  注意:要確保在運行之前你的MVC項目已經生成。如果你添加了GuestResponse類但是沒有生成它,MVC將不能為這個類型創建強類型視圖。

  RsvpForm動作方法中右鍵選擇【Add View】來創建視圖。在【Add View】窗口中,選中Create a strongly-typed view項然后在下拉框中選擇GuestResponse。不選擇Use a layout or master page,確保選擇的是Razor視圖引擎並且Scaffole template選項中選擇Empty。如圖2-14

  

  點擊【Add】按鈕隨后Visual Studio會創建一個叫做RsvpForm.cshtml並自動打開以便編輯。你可以在清單2-11中看到初始內容。你會注意到,這是另外一個HTML文件,但是它包含一個@model Razor表達式。這時候你會明白,這就是強類型視圖的關鍵所在並且它提供了便捷。

清單2-11
@model PartyInvites.Models.GuestResponse
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>RsvpForm</title>
</head>
<body>
<div>
</div>
</body>
</html>

 

  建立表單

  現在我們已經創建了強類型視圖,為了編輯GuestResponse對象,我們在RsvpForm.cshtml中添加了一些內容。編輯你的視圖使它和清單2-13一樣。

清單2-13
@model PartyInvites.Models.GuestResponse
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>RsvpForm</title>
</head>
<body>
@using (Html.BeginForm()) {
<p>Your name: @Html.TextBoxFor(x => x.Name) </p>
<p>Your email: @Html.TextBoxFor(x => x.Email)</p>
<p>Your phone: @Html.TextBoxFor(x => x.Phone)</p>
<p>
Will you attend?
@Html.DropDownListFor(x => x.WillAttend, new[] {
new SelectListItem() {Text = "Yes, I'll be there",
Value = bool.TrueString},
new SelectListItem() {Text = "No, I can't come",
Value = bool.FalseString}
}, "Choose an option")
</p>
<input type="submit" value="Submit RSVP" />
}
</body>
</html>

  對於GuestResponse模型類的每一個屬性,我們用一個HTML輔助方法來使它渲染成合適的HTML input控件。這些方法可以讓你通過使用拉姆達表達式使你選擇的屬性和input元素一一對應。例如:

  @Html.TextBoxFor(x => x.Phone)

  HTML TextBoxFor輔助方法為一個input元素生成HTMLtype設為textidname設為Phonephone是所選主域類屬性的名字。例如:

  <input id="Phone" name="Phone" type="text" value="" />

  正是因為我們的RsvpForm視圖是強類型所以我們才能這么方便的工作,並且我們已經告訴MVC GuestResponse是我們想要渲染到視圖的類型,所以HTML輔助方法能夠推斷出通過@模型表達我們要讀取屬性的數據類型

  如果你對C#拉姆達表達式不熟悉也不用擔心。我們在第四章提供了一個總結---但是一種替代拉姆達表達式的做法是以字符串的形式提供模型類型屬性的名稱。例如:

  @Html.TextBox("Email")

  我們發現拉姆達表達式技術可以防止我們把模型類型屬性寫錯,因為Visual Studio的智能提示會自動的讓我們選擇屬性,如圖2-15

  

  

  另一個方便的輔助方法是Html.BeginForm,它可以產生一個HTML表單元素,它被配置用來回遞給動作方法。因為我們沒有給這個輔助方法提供任何參數,它就會認為我們要回遞的是相同的URL。一個巧妙的方法就是把它包在C#using語句中,例如:

@using (Html.BeginForm()) {

...form contents go here...

}

  通常,像這樣運用,using語句塊可以確保當對象超出范圍時對象可以被釋放。它通常被用在數據庫連接,例如,要確保當一個查詢完成連接是關閉的。(這里的using關鍵字的用法不同於在類中引用命名空間的用法。)

  與釋放對象不同,HtmlBeginForm會關閉表單元素在它超出范圍時。這也就意味着Html.BeginForm輔助方法生成了表單的兩部分,例如:

<form action="/Home/RsvpForm" method="post">

...form contents go here...

</form>

  如果你對釋放C#對象不熟悉也沒有關系。這里主要是為了說明怎樣通過HTML輔助方法創建表單。當你運行程序時,你會看到在RsvpForm中的表單,如果你點擊RSVP Now鏈接。如圖2-16

  

 

 

 

 

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM