第11章ASP.NETMVC開發(fā)速成

本章目標

ASP.NETMVC簡介第一個ASP.NETMVC程序Razor基礎語法ASP.NETMVC的新聞管理數(shù)據(jù)驗證使用Ajax分頁顯示新聞文件上傳ASP.NETMVC簡介

1.WebForm方式開發(fā)的優(yōu)缺點WebForm方式的優(yōu)點：支持事件模型開發(fā)。得益于豐富的服務器端組件，webfrom開發(fā)可以迅速的搭建web應用使用方便，入門容易控件豐富WebFrom方式的缺點封裝太強，很多底層東西讓我們初學者不是很明白入門容易，提升很難復雜的生命周期模型學習起來并不容易控制不靈活ViewState處理ASP.NETMVC簡介2.MVC模式MVC模式是“Model-View-Controller”的縮寫，即“模式-視圖-控制器”。MVC模式的目的是實現(xiàn)一種動態(tài)的程序設計，使后續(xù)對程序的修改和擴展簡化，并且使程序某一部分的重復利用成為可能。除此之外，此模式通過對復雜度的簡化，使程序結構更加直觀。MVC把應用程序分成三個核心模塊：模型、視圖和控制器，它們分別擔負不同的任務。這三個部分以最少的耦合協(xié)同工作，從而提高應用程序的可擴展性及可維護性。ASP.NETMVC簡介3.ASP.NETMVC微軟于2009年微軟在ASP.NET3.5基礎之上推出了

ASP.NETMVC框架，ASP.NETMVC框架是繼ASP.NETWebForms后的又一種開發(fā)方式，它提供了一系列優(yōu)秀特性，使ASP.NET開發(fā)人員擁有了另一個選擇。ASP.NETMVC簡介4.ASP.NETMVC優(yōu)點ASP.NETMVC開發(fā)有以很容易將復雜的應用分成M、V、C三個組件模型。通過model、view和controller有效的簡化了復雜的架構，體現(xiàn)了很好的隔離原則因為沒有使用server-basedforms。所以程序員控制的更加靈活，頁面加干凈可以控制生成自定義的url。對于seo友好的url更是不在話下強類型View實現(xiàn)，更安全、更可靠、更高效。

讓web開發(fā)可以專注于某一層。更利于分工配合適用于大型架構開發(fā)很多企業(yè)已經使用MVC作為項目開發(fā)框架第一個ASP.NETMVC程序第一個ASP.NETMVC程序（1）運行VS2013(2)點擊菜單“文件”--“新建”項目”，打開“新建項目”窗口（3）在彈出的“新ASP.NETMVC4項目”窗口，模板選擇“基本”，視圖引擎選擇“Razor”(4)右鍵點擊“Controllers”文件夾，在彈出菜單中選擇“添加”--“控制器”，在“添加控制器”窗口中輸入控制器名稱NewsController，模板選“空MVC控制器”。第一個ASP.NETMVC程序（5）點擊“添加”，Controllers文件夾下生成一個NewsController.cs文件（6）點擊添加，在項目的Views/News文件夾中添加了一個Index.cshtml文件（7）按ctrl+F5運行，開始會顯示“應用程序中的服務器錯誤”，因為沒有設置默認首頁；在瀏覽器地址后面加上News/Index，最終路徑http://localhost:60210/News/Index（8）設置首頁。

前面運行需要手動輸入網頁地址，網站一般有個默認首頁，URL只需要輸入網站地址，瀏覽器就會顯示首頁。ASP.NETMVC可以通過路由文件來設置首頁。第一個ASP.NETMVC程序（9）修改模板

如果網站許多頁面有相同的部分，可以為網站設置一個模板，就如WEBForm開發(fā)的母版頁一樣。網站模板文件是Views/Shared文件夾下的_Layout.cshtml文件，模板內容只要修改文件。Razor基礎語法1．代碼體{...}

@{varx=100;vary=100;stringstr="thisisstring"；

}

在代碼體中，每一行都需要用";"結束，代碼區(qū)中，字母區(qū)分大小寫。字符類型常量必須用""括起來，Razor基礎語法

2．由于引擎會檢解析查每個已@開頭的代碼，除非@前包括非空白字符；如：<div>test@razor</div>這樣輸出的信息還是test@razor，這不會進行解析，頁面輸出@符合，可以用HTML中的ASCII編碼@。

3．在Razor中使用局部變量，進行上下文調用：

@{varmessage="現(xiàn)在時間為:";vartime=DateTime.Now;varoutMessage=message+time;}<div>@outMessage</div>

頁面輸出為：現(xiàn)在時間為:2011/12/1420:26:13;Razor基礎語法4．字符拼接輸出

@{varcout=100;}<p>這是第

@count個進球

</p>

頁面輸出：這是第

100個進球

5．在@{...}代碼體中輸出文字，需要用到@:,如下所示：

@{varname="張三";@:你好：

@:@name}頁面輸出：你好：張三Razor基礎語法6．邏輯代碼處理

@{if(true){//dosomething;}else{//dosomething;}}

7．在@{...}代碼體內部使用html標記

@{<div>thisis<span>test</span></div>}

頁面輸出：thisistestRazor基礎語法8．在@{...}內部使用注釋

@{//單行注釋

varmesage="NowTime:";

@*

當前時間

輸出當前時間

*@/**使用C#中的

*注釋

*/vartime=DateTime.Now;<!--HTML注釋-->varoutMessage=mesage+time;}ASP.NETMVC的新聞管理基本功能介紹創(chuàng)建程序新聞列表 刪除新聞增加新聞 修改新聞 基本功能介紹簡單新聞管理系統(tǒng)實現(xiàn)了新聞的列表顯示（圖11-8）、發(fā)布新聞（圖11-9）、修改新聞（圖11-10）、刪除新聞（圖11-8）、顯示新聞詳情(圖11-11)的功能。創(chuàng)建程序（1）在SQLServer中附加本書提供demo_Data.mdf文件，創(chuàng)建數(shù)據(jù)庫demo，新聞系統(tǒng)使用其中的News表（2）運行vs2013,點擊菜單“文件”—”打開”—“項目/解決方案”打開前面創(chuàng)建的第一個ASP.NETMVC程序（3）右鍵單擊Models文件夾，點擊菜單“添加”—“現(xiàn)有項”，添加數(shù)據(jù)庫幫助類DBHelper.cs、模型類News.cs、數(shù)據(jù)庫操作類NewsDao.cs。(4)設置數(shù)據(jù)庫的連接信息新聞列表（1）打開NewsController.cs（2）修改Index方法（3）打開Index.cshtml,修改內容（4）運行程序，效果如圖11-8所示。刪除新聞（1）打開NewsController.cs，添加Delete方法publicActionResultDelete(intid){NewsDaonewsDao=newNewsDao();newsDao.Delete(id);returnRedirectToAction("Index");

}

（2）運行程序，點擊“刪除”鏈接，可以看到相應記錄被刪除。增加新聞（1）打開NewsController.cs，添加Add方法（2）光標定位于Add方法內，右擊鼠標，在彈出菜單中選擇“添加視圖”（3）點擊添加，在Views/News文件夾下增加了一個Add.cshtml文件（4）運行程序，在頁面點擊“增加”，跳轉到增加頁面，在增加頁面可以發(fā)布新聞。修改新聞(1)打開NewsController.cs，添加Edit方法(2)光標定位于Edit方法內，右擊鼠標，在彈出菜單中選擇“添加視圖”（3）點擊添加，在Views/News文件夾下增加了一個Edit.cshtml文件（4）運行程序，在頁面點擊“編輯”，跳轉到相應記錄的編輯頁面，在編輯頁面可以實現(xiàn)對信息的修改。數(shù)據(jù)驗證（1）打開前面實現(xiàn)了基本功能的新聞系統(tǒng)項目（2）打開News.cs修改（3）打開NewsController.cs,修改

[HttpPost]的Add方法（4）運行程序，觀察到標題、內容標簽已經顯示在News.cs中設置的漢字；在頁面點擊增加，標題如果為空，會給出錯誤提示；內容超過100個字，會給出錯誤提示，并且阻止提交。使用Ajax（1）打開實現(xiàn)基本功能的新聞系統(tǒng)項目（2）在Models文件夾添加Msg.cs(3)打開NewsController.cs,修改Delete方法（4）打開Index.cshtml修改（5）運行程序，點擊“刪除”，觀察記錄刪除但沒有整個頁面刷新。分頁顯示新聞（1）打開實現(xiàn)基本功能的新聞系統(tǒng)項目

（2）在Models文件夾添加Common.cs（3）在NewsDao.cs添加方法（4）修改NewsController.cs的Index方法（5）在Index.cshtml文件末尾中增加：

@MvcHtmlString.Create(ViewBag.pager)

(6)運行程序，效果如圖11-16所示。文件上傳(1）打開實現(xiàn)基本功能的新聞系統(tǒng)項目

(2)修改Add.cshtml（3）打開NewsController.cs,修改

[HttpPost]的A