<a href="#qy">前言</a>
<a href="#model">建立Model</a>
<a href="#context">建立資料庫上下文DbContext</a>
<a href="#init">建立初始化資料</a>
<a href="#controller">建立Controller</a>
<a href="#view">建立View</a>
<a href="#result">檢視結果頁面</a>
<a href="#db">檢視資料庫</a>
<a href="#end">結尾</a>
前面鋪墊了那麼多，今天我們就用MVC5 + EF6 + Bootstrap3來正式建立一個基本查詢頁面。
為什麼從查詢頁面開始？嘿嘿，因為小弟的.Net生涯就是從查詢頁面開始的，記得正式工作的第一個月就是各種子產品的查詢。先做查詢有什麼好處？首先查詢隻讀資料，不寫資料。對資料庫本身的資料安全不造成影響也不怕寫入髒資料的麻煩。其次增删改查這四個操作裡面，查詢的難度應該是最小的，不用考慮事務流程等方面的問題。
本節最後将會生成如下頁面：
在Models檔案夾下建立一個類，命名為Worker.cs，這個類就是我們這裡要用到的Model。代碼如下：
為了友善說明，加入行号，如果想要複制代碼，請點選左上角的小圖示就會出現不帶行号的代碼。在Worker類的上面，第3行，建立了一個Sex的枚舉類型，保證Sex隻有Male和Female兩種取值。9到13行中Worker類用自動屬性的方法定義了5個屬性，其中Rating屬性前面有個問号表示這個屬性是nullable,可以是null。
這裡我們用Code First方法建立資料庫表。這個方法簡單點說就是先建立Model再根據Model生成資料庫表。
為了友善起見，這裡用的資料庫是Visual Studio自帶的LocalDb。
資料庫上下文，就是我們這裡的資料通路層，根據Model對資料庫表進行不同的操作。是以我們首先在項目中建立一個資料通路層檔案夾，命名為DAL。然後，在DAL檔案夾中建立Model對應的資料庫通路上下文類，命名為CompanyContext。寫入代碼如下：
因為我們這裡資料庫通路要用Entity Framework, 是以第1行要引入System.Data.Entity。第7行，我們的資料庫上下文繼承EF中的DbContext基類。第9行表示
CompanyContext 繼承基類DbContext的構造函數。第13行表示我們的Model Worker和CompanyContext中的資料集Workers對應。第15到18行定義了一個事件
OnModelCreating，這個事件在我們使用的Code First方法在資料庫中建立資料表時觸發。第17行的代碼的作用是使我們建立出來的資料庫表名字都是單數，不是複數。也就是說将來的資料庫表名是Worker而不是Workers。這也是我們建立資料庫表的習慣命名方法。
然後在Web.config檔案裡面加入這個資料庫上下文要用到的資料庫連接配接字元串。如下面的代碼所示，在Web.config檔案中找到<configuration>元素。然後在<configuration>元素内找到<connectionStrings>元素。最後在<connectionStrings>元素内加入如下<add>元素。
這樣我們的資料庫上下文CompanyContext就可以用這個連接配接字元串來通路資料庫了。解釋一下<add>元素裡的内容。name="CompanyContext"是連接配接字元串的名字，這個要和CompanyContext.cs 裡的base("CompanyContext")函數的參數一樣，這樣初始化資料庫上下文的時候才能讀到字元串。Data Source=(LocalDb)\v11.0表示使用的資料庫種類和版本。Catalog=Company是資料庫的名字。Integrated Security=SSPI是驗證方式。AttachDBFilename=|DataDirectory|\Company.mdf表示在我們這裡，資料庫檔案存在 ~\App_Data\Company.mdf 下。providerName="System.Data.SqlClient"表示我們這裡要用的資料庫連接配接器，或者叫資料庫驅動。
然後我們還要在Web.config中聲明資料庫上下文。在<configuration>中找到<entityFramework>元素。在<entityFramework>元素中找到<contexts>元素。在<contexts>元素中寫入如下<context>元素。
type="SlarkInc.DAL.CompanyContext, SlarkInc"中的SlarkInc.DAL.CompanyContext表示這個CompanyContext的NameSpace和類名。逗号後面的SlarkInc表示這個CompanyContext在SlarkInc.dll中。
這樣我們就把CompanyContext添加到了Entity Framework的上下文中。
為了友善測試，我們需要在資料庫建立好之後給其中添加一些資料。是以我們來建立一個資料初始化類來做這個工作。在DAL檔案夾中建立一個類，命名為CompanyInitializer.cs。寫入如下代碼：
第6行，我們的資料初始化類繼承了一個名為DropCreateDatabaseAlways的泛型類，這個類的作用就像它的名字，每次程式運作時都會删除并重新建立資料庫，這樣友善我們測試。第8到20行，就是初始化資料的函數，重寫了父類的Seed函數，并接受CompanyContext 作為資料庫上下文供我們操作。第18行用Linq文法将 students的資料添加到資料庫上下文的資料集中。第19行，将這些資料送出到資料庫。
然後要在Web.config檔案中配置這個初始化器。在剛才配置過的<context>中寫入如下所示的databaseInitializer即可。
type="SlarkInc.DAL.CompanyInitializer, SlarkInc"中的SlarkInc.DAL.CompanyInitializer表示這個CompanyInitializer的NameSpace和類名。逗号後面的SlarkInc表示這個CompanyInitializer在SlarkInc.dll中。
這樣我們的初始化器就完成了。
在Controllers檔案夾下建立一個Controller選擇"MVC 5 控制器 - 空"，命名為CompanyController.cs。寫入代碼如下：
為了使用之前建立的Model和資料庫上下文，在第3行引入DAL命名空間并在第9行初始化CompanyContext。在第12行建立Index Action傳回類型是ViewResult，那麼使用者請求就會傳回一個View頁面。然後在第12行把所有的資料傳遞給View。第12行ToList方法是把資料以List的形式輸出。
要建立CompanyController的Index Action對應的View，首先在Views檔案夾下建立Company檔案夾。然後在Company檔案夾下建立一個空視圖并選擇使用布局頁。命名為Index.cshtml。寫入如下代碼：
第1行，表示這個頁面用的Model是我們建立的Worker類。下面的代碼建立了一個table，用來顯示Controller傳來的資料。4-7行通過
DisplayNameFor擷取Model的屬性名作為列頭顯示。第9-25行通過DisplayFor函數顯示資料。
選擇在浏覽器中檢視。就能看到如下顯示結果。
頁面的頭部和尾部應用了~/Views/Shared/_Layout.cshtml的預設布局。中間部分就是在Index.cshtml檔案生成的表。其中的4列是Model Worker中除了id外的其它4列資料。表裡的五行資料是我們在~/DAL/CompanyInitializer.cs中初始化的資料。
右鍵點選頁面表格中的任何一個資料，選擇檢查元素，如下圖所示。
這樣在F12開發人員工具視窗的右側就會有對應元素的css樣式。
由于我們在Index.cshtml中設定了<table class="table">是以這個表格的所有元素都會套用Bootstrap的表格樣式，如下所示。
在解決方案資料總管中點選如下圖所示的顯示所有檔案按鈕使所有檔案顯示。然後在App_Data下會出現一個CompanyContext.mdf的資料庫檔案，如下圖所示。
輕按兩下這個檔案，會出現伺服器資料總管視窗如下圖所示：
可以看到兩個資料庫連接配接，不用擔心，第一個是我們運作程式後生成的連接配接，第二個是剛才輕按兩下mdf檔案生成的連接配接。兩個連接配接效果是一樣的。輕按兩下第二個連接配接的"表"檔案夾下的Worker表。就可以檢視我們用EF Code First 方法生成的表了。顯示如下：
左上方是表結構，右上方是表的其他屬性，下方是生成表用的SQL語句。
在伺服器資料總管中右鍵點選Worker表，選擇"顯示表資料"就會顯示如下圖的所有資料，是不是和頁面顯示的一樣呢？
這一節我們應用MVC5 + EF6 + Bootstrap3建立了第一個正式的資料查詢頁面。後面我們會給這個頁面加入關鍵字查詢、分頁、排序等功能。為了實作這些功能我們會介紹更多的EF函數及Linq的使用方法。敬請期待。
喜歡就點個贊吧！
本文版權歸作者和部落格園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接配接，否則保留追究法律責任的權利。如有問題或建議，請多多賜教，非常感謝。