創(chuàng)建首個asp.net頁面

本節(jié)我們將正式創(chuàng)建我們的首個頁面，并實現(xiàn)查詢數(shù)據(jù)庫顯示數(shù)據(jù)在瀏覽器上。

在我們了解相關(guān)基礎(chǔ)知識后，現(xiàn)在我們著手新建首個頁面。在開發(fā)asp.net三層架構(gòu)網(wǎng)站時，需要時刻遵守三層（UIL，BLL，DAL）原則。

首先，在我們之前新建的網(wǎng)站解決方案中添加首個頁面，右擊WebSite，添加——新建項，在彈出的對話框中，在“已安裝的模板”選擇“Web”，點擊“Web窗體”，修改新建頁面名稱“Index.aspx”,點擊“添加”按鈕，即完成新建頁面。

在新建頁面中，會發(fā)現(xiàn)在Index.aspx下還有兩個文件（Index.aspx.cs和Index.aspx.designer.cs）。其中我們習慣將Index.aspx.cs中代碼稱為后臺代碼，指的是C#語言編寫的代碼（當然如果使用VB也是可以的），相應(yīng)的有個前臺代碼，指的是設(shè)計代碼html、css、javascript等代碼構(gòu)成的。這樣的分層結(jié)構(gòu)使得asp.net在設(shè)計上更加合理，后臺邏輯代碼和前臺設(shè)計代碼的分開，方便開發(fā)，使團隊開發(fā)的效率更高。這種"前aspx后cs"的方式被稱為CoadBehind（代碼后置）。

頁面添加完畢后，我們即可運行，現(xiàn)在我在前臺代碼加入一句話“再見2012”（當然是為了顯示一下效果），然后將Index.aspx設(shè)為“起始頁”，右擊Index.aspx點擊“設(shè)為起始頁”。起始頁即是網(wǎng)站啟動調(diào)試時的首個頁面。

點擊“F5”啟動調(diào)試，如無意外，可見如圖。

當然，現(xiàn)在基本上還沒用到數(shù)據(jù)庫的內(nèi)容，接下來，我將著手將數(shù)據(jù)庫中的數(shù)據(jù)提取出來，并顯示在網(wǎng)頁上。

1. 我們首先要修改一下DAL文件夾中PinlicVar.cs中的一句代碼，我們稱之為鏈接字符串，雙擊PinlicVar.cs打開，可看到

其中Data Source=(local);Initial Catalog=WebSite1;Integrated Security=True就是我們說的鏈接字符串。其中

public static string jcglstr = Properties.Settings.Default.Setting;driver={SQL Server};server=主機ip地址; uid=用戶名;pwd=密碼;database=數(shù)據(jù)庫名

SQL提供兩種登錄方式（windows身份驗證和SQL server身份驗證），這里不詳細介紹，主要將Initial Catalog=WebSite1修改成自己數(shù)據(jù)庫名稱即可，一般情況下都可鏈接成功。（需要注意的是如果數(shù)據(jù)庫的版本是SQL2008 R2的，其中Data Source=(local)可能不成功，可做相應(yīng)修改，可填寫計算機名）。

2.在BLL文件夾中添加類文件，右擊BLL文件夾，添加——類，取名BLL_Index.cs（一個aspx頁面文件對應(yīng)一個BLL類文件，所以取名格式BLL_頁面名稱，這樣做的目的是在體現(xiàn)三層架構(gòu)的思想，對整個項目開發(fā)維護都起到很大的作用）。

至此我們先將數(shù)據(jù)庫中的存儲過程的名稱修改成Index，這樣的目的是出于對整體框架代碼可讀性考慮，這樣處理起來方便，一個頁面aspx（UIL）對于一個BLL文件，同時對于一個存儲過程，而且這些文件的命名都與頁面aspx名稱一樣，這樣無論是代碼的可讀性還是團隊間的合作分工更合理。

點擊打開BLL_Index.cs,添加三個using代碼

using System.Data;

using System.Text;

using System.Data.SqlClient;

再添加以下代碼

        public static DataTable Select_UserInfo()
        {
            SqlParameter[] SQLCMDpas ={
                                         new SqlParameter("@type",SqlDbType.Char ),
                                     };
            SQLCMDpas[0].Value = "Select_UserInfo";
            DataTable dt = DAL.PublicMethod.DAL_SelectDB_Par("Index", SQLCMDpas);
            return dt;
        }

如圖

在此解析一下幾個名詞

DataTable：

在命名空間System.Data下，其對它的解析是表示內(nèi)存中數(shù)據(jù)的一個表。

我們查詢數(shù)據(jù)庫時，得到的是一張二維表，DataTable可將其理解為一張二維的數(shù)據(jù)表。

SqlParameter：

在命名空間System.Data .SqlClient下，表示System.Data.SqlClient.SqlCommand的參數(shù)

其中new SqlParameter("@type",SqlDbType.Char ),初始化新實例，其中@type為存儲過程Index的形參，SqlDbType.Char為對應(yīng)的數(shù)據(jù)類型。

SQLCMDpas[0].Value = "Select_UserInfo";

將對象數(shù)組SQLCMDpas[0]的值賦值為“Select_UserInfo”（即@type傳遞的參數(shù)為"Select_UserInfo"，剛好對存儲過程Index中的其中一個if語句，這樣就可執(zhí)行該語句下SQL）。

DAL.PublicMethod.DAL_SelectDB_Par("Index", SQLCMDpas);

該方法執(zhí)行的是DAL文件夾中PublicMethod.cs中的DAL_SelectDB_Par方法。

傳遞的參數(shù)“Index”對于的是存儲過程Index的名稱。SQLCMDpas對應(yīng)的是存儲過程Index的參數(shù)。

DAL_SelectDB_Par方法執(zhí)行的查詢數(shù)據(jù)庫中的數(shù)據(jù)，其中運用的是ADO.NET技術(shù)查詢數(shù)據(jù)庫，里面執(zhí)行方法就是ADO.NET濃縮，在此就不作詳細的介紹，如果想深入了解，可自行查找資料（個人覺得還是有必要學習一下，雖然本方法可幫你完成相關(guān)的操作，但深入了解后對你的學習是有很大幫助的）。其方法的目的就是調(diào)用數(shù)據(jù)庫中的存儲過程“Index”，執(zhí)行相應(yīng)的查詢操作，返回一個表，然后該方法將DataTable返回BLL中。

總的來說，BLL中Select_UserInfo方法中的目的就是，將相關(guān)的參數(shù)存儲到SQLCMDpas中，然后通過DAL中DAL_SelectDB_Par方法調(diào)用數(shù)據(jù)庫的存儲過程“Index”，判斷@type的值執(zhí)行哪個If語句，然后返回一個DataTable。

3. 既然BLL中能夠查詢數(shù)據(jù)庫，返回DataTable表，那么我在UIL層中接受DataTable，那么即可獲取到數(shù)據(jù)庫中相應(yīng)的數(shù)據(jù)了。的確如此，我們在頁面的后臺代碼Index.aspx.cs中編碼接收Datatable的傳值。

protected void Page_Load(object sender, EventArgs e)

是頁面加載時必須執(zhí)行的語句，其實它是事件（Load事件）處理函數(shù)。

首先添加using System.Data，然后添加

DataTable dt_UserInfo = BLL.BLL_Index.Select_UserInfo();

進行接收DataTable表數(shù)據(jù)。

接下來剩下的工作就是將傳遞過來的DataTable數(shù)據(jù)顯示到網(wǎng)頁上。

因為現(xiàn)在我們數(shù)據(jù)庫還沒有任何數(shù)據(jù)，現(xiàn)在先手動地添加數(shù)據(jù)到tb_User表中。

接下介紹asp.net一個控件GridView

打開Index.aspx前臺代碼，添加GridView控件，可在工具欄中找到GridView，將其拖曳到前臺代碼中。

接下來，在前臺的設(shè)計視圖中點中GridView控件，點擊其右上角的按鍵，再點擊“編輯列”，在彈出對話窗中可用字段點中“BoundField”，再點擊“添加”，再修改其屬性中“DataField”為“UserId”（其“UserId”對應(yīng)的是DataTable中查詢出來的字段的名稱，即數(shù)據(jù)庫中tb_User表的字段UserId），再修改“HeaderText”為“用戶Id”（標頭的名稱）。相應(yīng)地添加三個字段。一般不勾選左下角“自動生成字段”，如圖

回到后臺代碼，對GridView進行數(shù)據(jù)綁定，添加

            GridView1.DataSource = dt_UserInfo;

            GridView1.DataBind();

對于GridView更詳細介紹，可自行學習。

至此，基本完成一個頁面查詢數(shù)據(jù)庫顯示數(shù)據(jù)的相關(guān)操作，點擊“F5”啟動調(diào)試。如無意外，將會出現(xiàn)下圖

首個asp.net頁面創(chuàng)建完成，本節(jié)篇幅還是比較長的，整體來講脈絡(luò)還是比較清晰的。

上一講： ASP.NET簡易教程3——SQL存儲過程

下一講：ASP.NET簡易教程5——三層架構(gòu)與非三層架構(gòu)的優(yōu)缺點比較