第二章 初識ASP.NET MVC項目開發(fā)

ASP.NETMVC程序開發(fā)第二章初識ASP.NETMVC項目開發(fā)第二章初識ASP.NETMVC項目開發(fā)ASP.NETMVC程序開發(fā)第

2頁2.1示例項目概述——在線書店2.2利用項目模板創(chuàng)建ASP.NETMVC項目2.3創(chuàng)建控制器2.4創(chuàng)建數(shù)據(jù)模型2.5創(chuàng)建視圖2.6實現(xiàn)訂單提交功能小結(jié)2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

3頁

在線書店是一個完整的ASP.NETMVC項目，其中包括購物，結(jié)賬和管理等功能，如圖所示。本書中的很多示例都來自這個Web應(yīng)用程序，并將以此項目貫穿始終，帶領(lǐng)讀者由淺入深，逐漸掌握ASP.NETMVC項目開發(fā)方法。2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

4頁網(wǎng)站首頁2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

5頁瀏覽：根據(jù)類別瀏覽書籍2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

6頁購書：向購物車中添加書籍2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

7頁購物車：查看和管理購物車2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

8頁結(jié)算：生成一個訂單并且結(jié)賬注銷登錄2.1示例項目概述——在線書店ASP.NETMVC程序開發(fā)第

9頁管理：編輯書籍列表（管理員功能）2.2利用項目模板創(chuàng)建ASP.NETMVC項目

ASP.NETMVC程序開發(fā)第

10頁ASP.NETMVC是一套建立在ASP.NET基礎(chǔ)上的Web應(yīng)用項目開發(fā)框架，在VisualStudio2010中提供了完整的ASP.NETMVC項目模板，利用此模板可以快速的創(chuàng)建標準的ASP.NETMVC項目。

用ASP.NETMVC項目模板創(chuàng)建項目的步驟如下。2.2利用項目模板創(chuàng)建ASP.NETMVC項目

ASP.NETMVC程序開發(fā)第

11頁1、啟動VisualStudio2010，打開“文件”菜單，選擇“項目”選項。（本書使用的是ASP.NETMVC4開發(fā)環(huán)境，該環(huán)境要求在安裝VisualStudio2010sp1版本的基礎(chǔ)上額外下載并安裝ASP.NETMVC4forVisualStudio2010，參見/mvc/mvc4）2.2利用項目模板創(chuàng)建ASP.NETMVC項目

ASP.NETMVC程序開發(fā)第

12頁2、在“新建項目”窗口的“已安裝的模板”列表中選擇“Web”類別，然后在項目模板列表中選擇“ASP.NETMVC4Web應(yīng)用程序”。最后點擊“確定”按鈕。2.2利用項目模板創(chuàng)建ASP.NETMVC項目

ASP.NETMVC程序開發(fā)第

13頁3、在“新ASP.NETMVC4項目”窗口中的“選擇模板”列表中選擇“Internet應(yīng)用程序”模板，在“視圖引擎”下拉列表框中選擇“Razor”，目前暫時不用勾選“創(chuàng)建單元測試項目”。最后點擊“確定”按鈕。2.2利用項目模板創(chuàng)建ASP.NETMVC項目

ASP.NETMVC程序開發(fā)第

14頁4、此時，ASP.NETMVC4項目已經(jīng)創(chuàng)建完成，選擇“調(diào)試”菜單下的“開始調(diào)試”菜單項，即可啟動一個默認的ASP.NETMVC網(wǎng)站。該網(wǎng)站已具備基本的功能，包括簡單的頁面和會員機制。這些頁面都是用了Razor的布局為網(wǎng)站定義的公共模板和ASP.NET內(nèi)置的Membership功能，可以進行會員注冊、登錄、注銷等操作。2.3創(chuàng)建控制器

ASP.NETMVC程序開發(fā)第

15頁ASP.NETMVC的核心就是控制器（Controller），它負責處理瀏覽器傳送過來的所有請求，并決定要將什么內(nèi)容響應(yīng)給瀏覽器。但控制器并不負責決定內(nèi)容應(yīng)該如何顯示，而是僅將特定格式的數(shù)據(jù)響應(yīng)給ASP.NETMVC架構(gòu)，最后才由ASP.NETMVC架構(gòu)依據(jù)響應(yīng)的形態(tài)來決定如何將數(shù)據(jù)響應(yīng)給瀏覽器。

創(chuàng)建控制器和動作的步驟如下：

2.3創(chuàng)建控制器

ASP.NETMVC程序開發(fā)第

16頁1、打開ASP.NETMVC4項目，在“解決方案資源管理器”窗口中選擇“Controllers”目錄并單擊鼠標右鍵，在彈出的快捷菜單中選擇“添加”下面的“控制器”選項。

2.3創(chuàng)建控制器

ASP.NETMVC程序開發(fā)第

17頁2、在“添加控制器”窗口中輸入控制器名稱StoreController，如圖2-12所示，然后點擊“添加”按鈕。

此時，VisualStudio2010會創(chuàng)建一個名為“StoreController.cs”的Controller類文件，在該類中會默認新建一個名為Index的動作。2.3創(chuàng)建控制器

ASP.NETMVC程序開發(fā)第

18頁在簡化版在線書店項目中，上述Index動作將被用來顯示所有待售書籍。對于這個動作，我們將在下一節(jié)中對其添加數(shù)據(jù)訪問代碼。對于Order和Details兩個動作，我們也將在下一節(jié)中對其添加數(shù)據(jù)訪問代碼，以實現(xiàn)“提交訂單”和“查看訂單”功能。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

19頁在ASP.NETMVC中，數(shù)據(jù)模型（Model）負責所有與數(shù)據(jù)有關(guān)的任務(wù)，不管是控制器（Controller）還是視圖（View），都會參考數(shù)據(jù)模型里面定義的數(shù)據(jù)類型，或是使用數(shù)據(jù)模型里定義的一些數(shù)據(jù)操作方法，例如新建、刪除、修改、查詢等。本節(jié)將繼續(xù)通過簡化版在線書店項目為例，介紹ASP.NETMVC4中數(shù)據(jù)模型創(chuàng)建與使用的基本方法。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

20頁首先，讓我們?yōu)楹喕嬖诰€書店項目創(chuàng)建一個名為MvcBookStore的數(shù)據(jù)庫，該數(shù)據(jù)庫應(yīng)該包含Books和Orders兩個數(shù)據(jù)表，分別存放書籍數(shù)據(jù)和訂單數(shù)據(jù)。因為是簡易版在線書店項目，所以為了方便我們假設(shè)一個訂單只包含一本書暫且讓訂單與書籍為多對一的關(guān)系，但是要注意，在實際的項目開發(fā)中訂單與書籍應(yīng)該是多對多的關(guān)系。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

21頁基于EntityFramework技術(shù)的數(shù)據(jù)模型創(chuàng)建步驟如下：1、打開簡化版在線書店項目，在“解決方案資源管理器”窗口中選擇“Models”目錄并單擊鼠標右鍵，在彈出的快捷菜單中選擇“添加”下面的“新建項目”選項。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

22頁

2、在“新建項目”窗口的“已安裝的模板”列表中選擇“數(shù)據(jù)”類別，然后在項目模板列表中選擇“ADO.NET實體數(shù)據(jù)模型”并將名稱改為“BookStore.edmx”。最后點擊“確定”按鈕。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

23頁

3、在“實體數(shù)據(jù)模型向?qū)А贝翱谥?，選擇“從數(shù)據(jù)庫產(chǎn)生”。最后點擊“下一步”按鈕。4、創(chuàng)建數(shù)據(jù)庫連接，并連接到“MvcBookStore”數(shù)據(jù)庫，并將實體連接字符串改名為“BookStoreEntities”。最后點擊“下一步”按鈕。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

24頁

5、選擇數(shù)據(jù)庫對象，勾選“數(shù)據(jù)表”對象。最后點擊“完成”按鈕。此時，就創(chuàng)建完成簡化版在線書店項目所需的數(shù)據(jù)模型了。該數(shù)據(jù)模型可用來對數(shù)據(jù)庫進行數(shù)據(jù)查詢與寫入等操作。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

25頁在這里，項目的“Models”目錄只是一個目錄而已，其主要目的是幫助開發(fā)人員養(yǎng)成將與數(shù)據(jù)訪問獲業(yè)務(wù)邏輯有關(guān)的程序都統(tǒng)一集中在“Models”目錄下的習慣，但并不強制，并且當項目規(guī)模變大時還可以將整個“Models”目錄轉(zhuǎn)變成一個獨立的項目。2.4創(chuàng)建數(shù)據(jù)模型

ASP.NETMVC程序開發(fā)第

26頁最后，我們在本項目“StoreController”控制器類的“Index”與“Details”兩個動作中分別加入一段代碼，讓“Index”動作能夠獲取全部待售書籍的數(shù)據(jù)，讓“Details”動作能夠獲取全部訂單的數(shù)據(jù)。2.5創(chuàng)建視圖

ASP.NETMVC程序開發(fā)第

27頁視圖（View）在ASP.NETMVC中負責將控制器（Controller）傳送過來的數(shù)據(jù)轉(zhuǎn)換成客戶端需要的輸出格式。所有視圖中的代碼應(yīng)該是主要完成數(shù)據(jù)顯示這項工作，而不應(yīng)該有其他的用途。本節(jié)將繼續(xù)通過簡化版在線書店項目為例，介紹ASP.NETMVC4中視圖創(chuàng)建與使用的基本方法。接下來，我們將為簡化版在線書店項目創(chuàng)建一個Index視圖，完成在線書店的“待售書籍瀏覽”功能。2.5創(chuàng)建視圖

ASP.NETMVC程序開發(fā)第

28頁在正式創(chuàng)建試圖之前，我們需要完善StoreController控制器類的Index動作的代碼，在ASP.NETMVC架構(gòu)中動作與視圖通常是對應(yīng)的，我們需要讓Index動作能夠傳送待售書籍數(shù)據(jù)到對應(yīng)視圖。接下來，可以使用VisualStudio幫我們自動創(chuàng)建強類型視圖，在代碼編輯器的“Index”動作對應(yīng)函數(shù)上單擊鼠標右鍵并選擇“加入視圖”菜單項2.5創(chuàng)建視圖

ASP.NETMVC程序開發(fā)第

29頁在默認情況下，視圖名稱一般不需要修改，默認視圖名稱會與動作名稱一致。勾選“強類型視圖”多選框，并在“模類型”下拉列表框中選擇“Books”（注意在添加視圖前要將項目編譯生成一次，否則在“模類型”下拉列表框中是找不到“Books”選項的），也就是“Index”動作創(chuàng)遞給視圖的數(shù)據(jù)類型，然后在“支架模版”下拉列表框中選擇“List”。最后點擊“添加”按鈕創(chuàng)建視圖。2.6實現(xiàn)訂單提交功能

ASP.NETMVC程序開發(fā)第

30頁“提交訂單”功能涉及到兩部分內(nèi)容，一是在訂單頁面中要能顯示用戶將要購買的書籍，其次是用戶能通過訂單頁面將購書數(shù)量和送貨地址等信息提交到系統(tǒng)。這里我們將逐步了解到在ASP.NETMVC架構(gòu)中如何通過控制器中的動作接收鏈接中的數(shù)據(jù)、如何在視圖中創(chuàng)建表單以及如何把視圖中表單數(shù)據(jù)傳遞到控制器里的動作。2.6.1在動作中接收連接參數(shù)

ASP.NETMVC程序開發(fā)第

31頁在上一節(jié)完成的簡易版在線書店項目中，我們已經(jīng)實現(xiàn)了瀏覽待售書籍的頁面，在該頁面的每一本書籍封面的后面都留有一個名為“購書”的鏈接，我們希望當用戶點擊該鏈接后系統(tǒng)能跳轉(zhuǎn)到對應(yīng)書籍的購買頁面，這個頁面就是實現(xiàn)“訂單提交”功能的頁面。2.6.1在動作中接收連接參數(shù)

ASP.NETMVC程序開發(fā)第

32頁通過代碼首先通過實體數(shù)據(jù)模型查詢到參數(shù)id對應(yīng)的具體書籍信息，然后書名、作者名、價格和書籍封面地址表存到ViewData中，以便對應(yīng)試圖使用。完成Order函數(shù)后，就可以按照上節(jié)所介紹的方式為其添加視圖了，只不過這里在“添加視圖”窗口中不再需要勾選“添加強類型視圖”多選框了。2.6.1在動作中接收連接參數(shù)

ASP.NETMVC程序開發(fā)第

33頁待視圖創(chuàng)建完成后，在視圖里補充代碼，以便試圖能夠顯示用戶希望購買的書籍的信息。

從視圖代碼中不難看出ViewBag對象可以用來將Order動作對應(yīng)函數(shù)中的數(shù)據(jù)傳遞到對應(yīng)的視圖，最后運行項目，在書籍瀏覽頁面中點擊“購書”鏈接，就能跳轉(zhuǎn)到對應(yīng)的提交訂單頁面了。2.6.2在視圖中創(chuàng)建表單

ASP.NETMVC程序開發(fā)第

34頁在上一節(jié)，我們創(chuàng)建了“提交訂單”功能的頁面，并能在頁面中顯示用戶希望購買的書籍信息，接下來需要在該頁面中創(chuàng)建表單讓用戶可以輸入購書數(shù)量和送貨地址等信息，并提交。

要在視圖中創(chuàng)建表單可以使用ASP.NETMVC內(nèi)置的HTML輔助方法來生成字段，需要顯示標簽的地方可以使用Html.Label()方法，需要顯示文本框的地方則可以使用Html.TextBox()方法并在該方法的第一個參數(shù)中輸入字段名稱。2.6.2在視圖中創(chuàng)建表單

ASP.NETMVC程序開發(fā)第

35頁通過代碼不難看出，action屬性中的路徑是直接寫在代碼中的（也就是“/Store/Order”這個路徑），表示這個表單在送出數(shù)據(jù)時會發(fā)送給Store控制器的Order動作。

2.6.2在視圖中創(chuàng)建表單

ASP.NETMVC程序開發(fā)第

36頁目前Order表單的提交地址是固定的，不過將表單提交地址直接寫在代碼中并不好，因為在ASP.NETMVC中，網(wǎng)址路徑可以通過“RouteConfig.cs”文件中的RouteConfig類來自定義和隨時修改，所以當修改了RouteConfig類后，還要連帶修改相關(guān)多個視圖中的表單提交地址，這就會帶來很多麻煩。2.6.2在視圖中創(chuàng)建表單

ASP.NETMVC程序開發(fā)第

37頁其實在ASP.NETMVC中，可以利用Html.BeginForm()輔助方法實現(xiàn)自動輸出表單標記。

最后運行項目，在書籍瀏覽頁面中點擊“購書”鏈接，就能跳轉(zhuǎn)到對應(yīng)的提交訂單頁面了，并且在頁面中可以填寫訂單信息并提交。

2.6.3將視圖中的表單數(shù)據(jù)傳遞到動作

ASP.NETMVC程序開發(fā)第

38頁在上一節(jié)中，我們在Order視圖中添加了表單，表單數(shù)據(jù)會被發(fā)送給Store控制器中的Order動作，而且表單中會有三個字段一起被送出，分別是BookId、Num和Address，表示書籍編號、購買數(shù)量和送貨地址。

2.6.3將視圖中的表單數(shù)據(jù)傳遞到動作

ASP.NETMVC程序開發(fā)第

39頁目前在Store控制器中已經(jīng)有了一個Order動作，該動作的作用是顯示“提交訂單”頁面并讓用戶輸入提交訂單數(shù)據(jù)，但是在用戶提交訂單數(shù)據(jù)后數(shù)據(jù)的接收者還是Order動作，如何才能區(qū)分這兩個同名但功能不同的Order動作呢？

2.6.3將視圖中的表單數(shù)據(jù)傳遞到動作

ASP.NETMVC程序開發(fā)第

40頁最好的方式就是用ASP.NETMVC中的HttpGet屬性和HttpPost屬性來區(qū)分動作，因為顯示“提交訂單”頁面的Order動作對應(yīng)的是HTTPGET請求，而接受表單數(shù)據(jù)的Order動作對應(yīng)的是HTTPPOST請求。

2.6.3將視圖中的表單數(shù)據(jù)傳遞到動作

ASP.NETMVC程序開發(fā)第

41頁在ASP.NETMVC中有一個數(shù)據(jù)模型綁定（ModelBinder）機制，通過這個機制可以自動將客戶端傳來的數(shù)據(jù)轉(zhuǎn)換成.NET類型的數(shù)據(jù)，也因為這樣，我們才能直接通過Order函數(shù)的參數(shù)取得表單傳遞過來的數(shù)據(jù)。2.6.3將視圖中的表單數(shù)據(jù)傳遞到動作

ASP.NETMVC程序開發(fā)第

42頁一般來說該函數(shù)參數(shù)的名稱與對應(yīng)表單數(shù)據(jù)的字段名一致，在頁面中表單的字段名指的是input標記中的name屬性的值。Order動作的前兩個參數(shù)屬于int類型，第三個參數(shù)屬于string類型，雖然通過Request.Form()方法取得的數(shù)據(jù)都是字符串類型的，但通過數(shù)據(jù)模型綁定機制，AS