在.net MVC架構中,據目前所知,應該是提倡徹底摒棄原有Web Forms中控件了,這樣的話,首先直接帶來的好處便是可以大大提高頁面加載的速度。
那如果放棄之前便捷的拖拽式UI控件后,首先遇到的便是UI上如何顯示內容的問題。
舉一個UI上的列表動態加載數據表中數據的例子來說:
如果是Web Form Page頁面,步驟通常為在工具欄選取控件,拖拽到頁面中,然后在后台Default.aspx.cs頁面中實現控件的動態綁定。
1)頁面加載后效果如下圖所示:
圖一
2)頁面Default.aspx.cs后台Page_Load事件中添加如下代碼:
1 protected void Page_Load(object sender, EventArgs e) 2 3 { 4 5 //頁面首次加載 6 7 if(!Page.IsPostBack) 8 9 { 10 11 var activityDs = new DataSet(); 12 13 14 15 using (var sqlConn = new SqlConnection(ConfigurationManager.ConnectionStrings["GTHCConnect"].ToString())) 16 17 { 18 19 sqlConn.Open(); 20 21 var sqlCommandText = " select * from dbo.ActivityCatalogInfo "; 22 23 var da = new SqlDataAdapter(sqlCommandText, sqlConn); 24 25 da.Fill(activityDs); 26 27 } 28 29 30 31 var categoryNameList = (from DataRow row in activityDs.Tables[0].Rows select Convert.ToString(row["NameCHS"])).ToList(); 32 33 BulletedList1.DataSource = categoryNameList; 34 35 BulletedList1.DataBind(); 36 37 } 38 39 }
那對於實現同樣動態列表顯示功能MVC Web .cshtml靜態頁面來說,無法使用以上的UI控件。那么要實現以上列表顯示的功能就得借助MVC的Razor語法。
1)頁面代碼如下所示,通過遍歷ViewData存儲列表內容,實現動態加載頁面上列表內容:
1 <ul> 2 3 <li><a id="0" href="javascript:void(0)">優惠活動</a></li> 4 5 <% foreach (DataRow activities in ((DataSet)ViewData["activityDs"]).Tables[0].Rows) 6 7 {%> 8 9 <li><%=Html.ActionLink((string) activities["NameCHS"], new { id = activities["CatalogId"] }.ToString())%> </li> 10 11 <%} 12 13 %> 14 15 </ul>
2)那對於ViewData["activityDs"]的內容的獲取,在MVC架構中,則通過Controller來實現,
在HomeController中的Index()方法中,添加如下代碼:
1 public ActionResult Index() 2 3 { 4 5 ViewData["Message"] = "歡迎使用 ASP.NET MVC!"; 6 7 var activityDs = new DataSet(); 8 9 10 11 using (var sqlConn = new SqlConnection(ConfigurationManager.ConnectionStrings["GTHCConnect"].ToString())) 12 13 { 14 15 sqlConn.Open(); 16 17 var sqlCommandText = " select * from dbo.ActivityCatalogInfo "; 18 19 var da = new SqlDataAdapter(sqlCommandText, sqlConn); 20 21 da.Fill(activityDs); 22 23 } 24 25 //將Dataset內容填充至ViewData["activityDs"]當中 26 27 ViewData["activityDs"] = activityDs; 28 29 return View(); 30 31 }
3)運行頁面,最終得到如下相同效果的動態列表頁面
看到這里,難免會有疑問,首先上面的MVC的代碼中只看到V(View),C(controller),M在哪里呢,上面的代碼只是偷懶的做法,因為MVC畢竟是一種設計架構思想嘛, 如果沒有M(model)照樣頁可以實現相同的功能。只是目前這樣就不是典型的MVC架構模式了(典型的MVC代碼實現,請參看MVC初探-數據訪問及頁面顯示之二)。
其次,和Web Forms代碼相比,實現思想都大同小異嘛,對,在加載內容,兩者實現思想區別不大,都是獲取數據庫中數據,並將其存放至容器中。前者是將其賦予控件的DataSource,后者則是賦予ViewData,區別在於前者是控件自身在頁面加載時動態解析DataSource內容,或者這是在頁面加載時,動態加載ViewData中存儲的內容。
那MVC的好處體現在哪,那對於加載速度,可維護性,可測試性的顯而易見的好處就不多說了,至少在本例中,它徹底摒棄了臃腫的UI控件,實現了靜態頁面中動態顯示內容的功能。