在前一篇文章Asp.net MVC 3 開發企業網站系統仿照部落格園部分功能--總體設計中介紹了資料庫的總體設計，現在呢我們就來實現部落格園的左側網站分類效果實現。當然因為我的前端功底實在不敢恭維，所以我採用部落格園的CSS和JS指令碼，這樣我們可以提高網站的實現速度，而不用為了前端的顯示介面調整浪費時間（註：前端很重要）。下面我就來說明我的這個分類的實現方式，如果您有更好的建議，歡迎您提出來！
在具體說明實現之前，我要說明一下這個網站系統我採用的架構或者說目錄實現方式（通過QQ顯示）：
現在我來說一下我這麼設計結構的原因：
1.IDBServices：這個是訪問資料庫以及對資料庫進行操作的介面。
2.ImpAccessServices：這個類庫是通過繼承IDBServices實現對Access資料庫的訪問、操作
3.ImpSqlServices：這個類庫實現自IDBServices介面，是對SqlServer資料庫的訪問。
4.ImpServices：繼承自IServices介面，實現對sqlserver或者Access等其他資料庫的訪問
5.IServices：服務層介面，這裡定義了多有對於資料庫可能進行的操作以及應該返回的資料類型，以及查詢介面
6.Models：獨立出來的MVC的Models層，這個類庫單獨獨立出來應該是所有項目都會採用的，這樣可以避免因為Models層的過大而影響MVC目錄結構，還有就是獨立出來可以由其他人員進行開發，方便整合。
7.MVCCompany：這個是MVC應用程式，是和使用者直接打交道的地方。
還有一點，我覺得有必要說一下，就是我單獨把資料訪問層介面放到獨立的類庫中，而把實作類別放到其他不同的類庫中，這樣我個人認為有兩個好處：1.就是方便管理，可以單獨開發，不會相互影響，2.就是可以更加有效進行IOC，依賴注入，更加方便的增加可維護性，我認為這是更加重要的方面。
為了增加這個小型網站的可維護性以及可擴充性或者可更改性，我採用的是將不同的部分單獨分開（比如首頁網站分類、顯示列表我都單獨分在不同的頁面中），在需要的地方進行組裝顯示。我想這也是現在軟體開發通用的方式。（其中UserControl就是一個例子）
好了，該介紹的我想都介紹完了，下面來示範過程：
強調一下，在MVC中可以進行組裝的方法有很多種，我採用的是Html.RenderAction()方法的一個重載，當然可以採用其他的諸如Html.Action().Html.Partial(),Html.RenderPartial()，採用母板頁方式（其實我個人特別反感在需要組裝的時候就使用母板頁，當然這是一個不錯的方式，但是有時候母板頁會帶來其他問題，不如採用MVC中的htmlHelper方法來的好。當然這隻是個人意見）等不同的方法。在這裡我想說一下，Html.RenderAction方法的執行效率會比Html.Action()效率高，至於為什嗎？當然這也是有條件的，各位可以查資料
開發過程：
1.建立所有的對資料庫的操作的實作類別，這是必須的
在這裡我建立的就是CategoryServices，是繼承自IServices介面的一個實作類別。其中定義了各種網站分類應該具有的方法，在這裡使用的就是返回所有的分類列表
public List<CategoryInfo> GetAll()方法，返回多有的網站分類的資料列表
2.建立好了網站分類的服務類以後，剩下的工作就輕鬆很多了。建立CategoryController,在該Controller的Action方法Index中定義需要的資料
1 public ActionResult Index()2 {3 CategoryServices cateServices = new CategoryServices();4 List<CategoryInfo> cateList = cateServices.GetAll();5 ViewBag.Cate = cateList;6 return View(cateList);7 }
該方法通過服務層類返回資料網站分類必須的資料，並且通過ViewBag傳遞到View層
3.在View層中顯示Controller傳遞的資料
@{ Layout = null;//表示母板頁為空白}<!DOCTYPE html><html><head> <title>Category</title></head><body> <div id="cate_title_block"> <div id="cate_title_title"> <div class="cate_title"> 網站分類</div> </div> <ul id="cate_item"> @{ List<Models.CategoryInfo> cateList = ViewBag.Cate as List<Models.CategoryInfo>; foreach (Models.CategoryInfo item in cateList) { if (string.IsNullOrEmpty(item.ParentID))//首先顯示所有的父級列表，因為父級列表的ParentID為空白，所以可以找到所有的父級列表顯示出來。 { <li id="cate_item_ @item.CategoryID" class="" onmouseout="cateHidden( @item.CategoryID)" onmouseover="cateShow(@item.CategoryID)"> <a href="">@item.CategoryName</a> </li> } } } </ul> <div class="cate_bottom"> </div> </div> <div id="cate_sub_block"> @{//顯示完了所有的父級列表以後，就需要顯示所有的子級列表，並且要設定其為Hidden。 var top = 30; foreach (Models.CategoryInfo item in cateList) { if (string.IsNullOrEmpty(item.ParentID)) { top = top + 20;//這個表示每個子級列表顯示的位置。距top的高度。 var topPix = top.ToString() + "px"; <div id="cate_content_block_@(item.CategoryID)" class="cate_content_block_wrapper" style="top:@topPix;display:none;" onmouseout="cateHidden(@(item.CategoryID))" onmouseover="cateShow(@(item.CategoryID))"> <div class="cate_content_top"> </div> <div class="cate_content_block"> <ul> @{ foreach (Models.CategoryInfo subItem in cateList) { if (subItem.ParentID == item.CategoryID) { <li> @Html.ActionLink(subItem.CategoryName, "cate", "category", new { id = subItem.CategoryID }, null) </li> } } } </ul> </div> <div class="cate_content_bottom"> </div> </div> } } } </div></body></html>
4.建立好了可以顯示的列表以後，我們就要讓他在首頁組裝了。通過Html.RenderAction()來在首頁渲染
@{ Layout = null;}<!DOCTYPE html><html><head> <title>Index</title> <link rel="Stylesheet" type="text/css" href="http://common.cnblogs.com/css/reset.css" /> <link rel="Stylesheet" type="text/css" href="http://common.cnblogs.com/blog/css/aggsite.css?id=2012120102" /> <link id="RSSLink" title="RSS" type="application/rss+xml" rel="alternate" href="http://feed.cnblogs.com/blog/sitehome/rss" /> <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script> <script src="http://common.cnblogs.com/script/json2.js" type="text/javascript"></script> <script src="http://common.cnblogs.com/blog/script/site.src.js?id=2012120102" type="text/javascript"></script></head><body> <div id="side_nav"> @{Html.RenderAction("index", "category");} </div></body></html>
可能有些園友很疑惑，為什麼我這裡的ID或者class都和部落格園的定義一樣，在這裡我想說一下就是，我前端真的很不在行，只能通過這種方式來提高進度。畢竟都是工作的人，時間很緊張。你懂得
5.下面來看一下我在本地調試顯示的效果。
可以說結果還是符合了我的預期。實現了對於部落格園首頁的網站分類列表的功能實現。下一個功能就是部落格園首頁中的列表顯示。
這個很簡單，我把我在開發中遇到的一些問題和大家說一下，希望可以得到協助。
我在設計這個網站系統的架構結構的時候，糾結了很久，總是想不到合適的能完全滿足我要求的架構，是我對於架構的經驗不足造成的，還是什麼原因呢？請各位解答，謝謝～有時候寫博真的能發現自己的很多問題，大家積極寫博，共同進步
第一篇：Asp.net MVC 3 開發一個簡單的企業網站系統
第二篇：Asp.net MVC 3 開發簡單的企業系統開篇--資料庫
第三篇：Asp.net MVC 3 開發企業網站系統仿照部落格園部分功能--總體設計
還有一點我忘記說了，就是對於這種靜態內容，不需要每次都從伺服器讀取資料再次進行顯示，這會非常的影響效能。我們可以採用Memcached對這些靜態不經常變動的資料進行緩衝，當然這個也以後進行。現在是先實現準系統，至於其他效能問題，以後逐漸加上
有園友提出代碼下載的地方找不到，我現在把tfs地址發出來，大家共用
大家可以到codeplex上搜尋bokeyuan，是部落格園的拼音就可以搜到這個項目，可以加入這個項目，讓我們一起來努力，加油 園友們
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
