九：跨頁(yè)面的主從報(bào)表

1、ASP.NET 2.0中的數(shù)據(jù)操作之九：跨頁(yè)面的主/從報(bào)表作者：heker2007 字體：增加 減小 類型：轉(zhuǎn)載 時(shí)間：2016-05-04 我要評(píng)論本文主要介紹在ASP.NET 2.0中通過(guò)HyperLinkField配置，將參數(shù)傳遞到新頁(yè)面，在新頁(yè)面顯示相應(yīng)的數(shù)據(jù)信息。導(dǎo)言在前面的兩篇教程中,我們看到了如何在單一頁(yè)面中顯示主/從報(bào)表, 它使用DropDownList顯示主記錄,使用GridView或DetailsView顯示詳細(xì)信息. 另外一種常見的主/從報(bào)表模式是在一個(gè)頁(yè)面中顯示主記錄而在另一個(gè)頁(yè)面中顯示詳細(xì)信息.互聯(lián)網(wǎng)上的論壇,如 ,就是該模式在實(shí)際應(yīng)用中

2、非常典型例子. Asp.Net論壇由多個(gè)子論壇組成: Getting Started, Web Forms, Data Presentation Controls 等等. 每個(gè)子論壇包含多個(gè)主題, 每個(gè)主題又由多個(gè)貼子組成. 在論壇主頁(yè)上列出了這些子論壇,單擊其中一個(gè)論壇會(huì)轉(zhuǎn)到ShowForum.aspx頁(yè)面, 該頁(yè)面列出了這個(gè)子論壇所包含的主題. 同樣,單擊一個(gè)主題會(huì)轉(zhuǎn)向ShowPost.aspx, 該頁(yè)面顯示所單擊主題的貼子.在這篇教程中,我們將通過(guò)使用GridView列出供應(yīng)商來(lái)實(shí)現(xiàn)該模式. GridView中的每行(一行便是一個(gè)供應(yīng)商)包含一個(gè)”查看產(chǎn)品”的鏈接. 該鏈接在單擊時(shí)會(huì)轉(zhuǎn)到

3、另外一個(gè)頁(yè)面, 這個(gè)頁(yè)面顯示選中供應(yīng)商的所有產(chǎn)品.Step 1: 在Filtering文件夾下添加 SupplierListMaster.aspx 和ProductsForSupplierDetails.aspx在第三篇教程中定義頁(yè)面結(jié)構(gòu)時(shí)我們?cè)贐asicReporting, Filtering, 和 CustomFormatting文件夾中增加了好幾個(gè)起始頁(yè)面.我們還沒(méi)有為這篇教程中添加起始頁(yè),在Filtering文件夾中增加兩個(gè)頁(yè)面: SupplierListMaster.aspx 和 ProductsForSupplierDetails.aspx. SupplierListMaster.

4、aspx將會(huì)列出主記錄(供應(yīng)商) ProductsForSupplierDetails.aspx將會(huì)顯示選中供應(yīng)商的產(chǎn)品.在創(chuàng)建這兩個(gè)頁(yè)面時(shí)注意要讓它們關(guān)聯(lián)Site.master母版頁(yè).圖1: 在Filtering文件夾下添加 SupplierListMaster.aspx 和ProductsForSupplierDetails.aspx此外, 添加了兩個(gè)文件到該項(xiàng)目后, 要確保相應(yīng)地更新站點(diǎn)地圖文件Web.sitemap. 對(duì)于該篇教程只要簡(jiǎn)單地使用下面的XML內(nèi)容做為元素的子節(jié)點(diǎn)提示:使用K. Scott Allen的免費(fèi)的Visual Studio Site Map Macro可以幫助你

5、在新增ASP.NET頁(yè)時(shí)自動(dòng)地更新站點(diǎn)地圖.Step 2: SupplierListMaster.aspx中顯示供應(yīng)商列表添加SupplierListMaster.aspx 和 ProductsForSupplierDetails.aspx后,接下來(lái)就是要在SupplierListMaster.aspx頁(yè)面上創(chuàng)建一個(gè)顯示供應(yīng)商的GridView. 添加一個(gè)GridView到頁(yè)面上并綁定到一個(gè)新的ObjectDataSource, 這個(gè)ObjectDataSource應(yīng)該使用SuppliersBLL類的GetSuppliers()方法返回所有供應(yīng)商.圖2: 選擇 SuppliersBLL 類圖3

6、: 配置ObjectDataSource 使用GetSuppliers() 方法我們需要在每個(gè)GridView行中包含一個(gè)”查看產(chǎn)品”鏈接,單擊時(shí)該鏈接會(huì)轉(zhuǎn)到ProductsForSupplierDetails.aspx頁(yè)面, 并在查詢字符串(querystring)傳遞選定行的SupplierID值.比如如果用戶單擊了供應(yīng)商Tokyo Traders(SupplierID值為4)的”查看產(chǎn)品”鏈接,將會(huì)轉(zhuǎn)到ProductsForSupplierDetails.aspx?SupplierID=4.要實(shí)現(xiàn)該功能, 給GridView添加一個(gè)HyperLinkField列, 它會(huì)為每個(gè)GridVi

7、ew行增加一個(gè)鏈接. 首先在GridView智能標(biāo)記上單擊編輯列鏈接. 然后在左上角的列表中選擇HyperLinkField并單擊新增把HyperLinkField添加到GridView的字段列表中.圖4: 添加 HyperLinkField 到GridViewHyperLinkField可以被配置為在每一個(gè)GridView行中使用相同的文本或URL值,或是讓這些值基于綁定到特定行的數(shù)據(jù)值. 要指定一個(gè)所有行都一樣的靜態(tài)值使用HyperLinkField的Text或NavigateUrl屬性. 因?yàn)槲覀兿胱屆恳恍械逆溄游谋疽恢?設(shè)置HyperLinkField的Text屬性為”查看產(chǎn)品”.圖5

8、: 設(shè)置HyperLinkField的Text屬性為”查看產(chǎn)品”要讓text 或URL基于綁定到GridView行的底層數(shù)據(jù), 可能通過(guò)DataTextField 或 DataNavigateUrlFields指定Text或URL要從中獲取數(shù)據(jù)的數(shù)據(jù)字段. DataTextField只能設(shè)置為一個(gè)單一的數(shù)據(jù)字段; DataNavigateUrlFields可以設(shè)置為一個(gè)以逗號(hào)分隔的數(shù)據(jù)字段列表. 我們需要讓TEXT或URL基于當(dāng)前行的數(shù)據(jù)字段值和一些標(biāo)記. 比如在這篇教程中,我們希望 HyperLinkField的鏈接URL是ProductsForSupplierDetails.aspx?Su

9、pplierID=supplierID. 其中supplierID是GridView的每個(gè)行的supplierID值. 注意我們需要靜態(tài)值和數(shù)據(jù)驅(qū)動(dòng)值. ProductsForSupplierDetails.aspx?SupplierID=這部分是靜態(tài)值.而supplierID部分便是數(shù)據(jù)驅(qū)動(dòng)的, 它的值是每一行的SupplierID值.要指定靜態(tài)值和數(shù)據(jù)驅(qū)動(dòng)值的混合物, 使用DataTextFormatString和DataNavigateUrlFormatString屬性. 在這些屬性中按需要輸入靜態(tài)文本,要顯示DataTextField或DataNavigateUrlFields屬性中特

10、定的字段時(shí)使用0標(biāo)記. 如果DataNavigateUrlFields中有多個(gè)字段,在需要第一個(gè)字段時(shí)使用0, 第二個(gè)字段使用1,以此類推.對(duì)于我們這篇教程來(lái)說(shuō), 我們需要設(shè)置DataNavigateUrlFields為SupplierID, 因?yàn)槲覀冃枰褂迷摂?shù)據(jù)字段自定義每行的鏈接.圖6: 配置HyperLinkField 使用合適的基于SupplierID 的鏈接地址.添加了HyperLinkField后, 可以自定義及重新排列GridView的字段. 下面是我做了修改后的標(biāo)記 (markup):在瀏覽器中訪問(wèn)一下SupplierListMaster.aspx. 如圖7所示, 頁(yè)面列出了

11、所有的供應(yīng)商,每個(gè)供應(yīng)商包含”查看產(chǎn)品”鏈接. 單擊”查看產(chǎn)品”鏈接會(huì)轉(zhuǎn)到ProductsForSupplierDetails.aspx, 并在查詢字符串中傳遞供應(yīng)商的SupplierID值.圖 7: 每個(gè)供應(yīng)商都包含”查看產(chǎn)品”鏈接.Step 3: 在ProductsForSupplierDetails.aspx上列出供應(yīng)商的產(chǎn)品SupplierListMaster.aspx頁(yè)面使用戶轉(zhuǎn)到ProductsForSupplierDetails.aspx, 并在查詢字符串中傳遞選擇的供應(yīng)商的SupplierID值. 本篇教程的最后一步是在ProductsForSupplierDetails.as

12、px 頁(yè)面上的GridView中顯示產(chǎn)品. 要實(shí)現(xiàn)該功能首先添加GridView到ProductsForSupplierDetails.aspx上,并使用一個(gè)新的命名為ProductsBySupplierDataSource的ObjectDataSource控件, 該控件調(diào)用ProductsBLL 類的GetProductsBySupplierID(supplierID)方法.圖8: 添加一個(gè)新的命名為 ProductsBySupplierDataSource 的ObjectDataSource圖9: 選擇ProductsBLL 類圖10: 讓ObjectDataSource 調(diào)用 GetPr

13、oductsBySupplierID(supplierID) 方法配置數(shù)據(jù)源向?qū)У淖詈笠徊绞且覀兲峁〨etProductsBySupplierID(supplierID) 方法中 supplierID 參數(shù)的來(lái)源. 要使用查詢字符串中的值. 設(shè)置參數(shù)源為QueryString 并在QueryStringField文本框中輸入查詢字符串值的名稱(SupplierID).圖11: 使用查詢字符串中的SupplierID值做為supplierID 參數(shù)的值這樣就可以了! 圖12顯示了當(dāng)我們?cè)赟upplierListMaster.aspx頁(yè)面中單擊Tokyo Traders供應(yīng)商的”查看產(chǎn)品”鏈接時(shí)

14、所看到的樣子.圖12: 顯示Tokyo Traders 供應(yīng)商的產(chǎn)品在ProductsForSupplierDetails.aspx中顯示供應(yīng)商信息如圖12所示, ProductsForSupplierDetails.aspx只列出了通過(guò)在查詢字符串中指定的SupplierID的供應(yīng)商的產(chǎn)品. 然而, 有些人會(huì)直接到達(dá)該頁(yè), 這樣他們就不清楚圖12中正中顯示Tokyo Trader的產(chǎn)品了. 要修正這個(gè)問(wèn)題, 我們可以在頁(yè)面上顯示供應(yīng)商的信息.在GridView上方添加一個(gè)FormView. 創(chuàng)建一個(gè)ObjectDataSource控件并命名為SuppliersDataSource. 該控件調(diào)

15、用SuppliersBLL類的GetSupplierBySupplierID(supplierID)方法.圖13: 選擇 SuppliersBLL 類圖14: 讓ObjectDataSource 調(diào)用 GetSupplierBySupplierID(supplierID) 方法使用查詢字符串中SupplierID的值為ProductsBySupplierDataSource的supplierID參數(shù)賦值.圖15: 讓supplierID 參數(shù)使用查詢字符串中的SupplierID 的值在設(shè)計(jì)視圖中綁定FormView到ObjectDataSource時(shí), Visual Studio 將會(huì)自動(dòng)的

16、創(chuàng)建FormView的ItemTemplate, InsertItemTemplate 和 EditItemTemplate 三個(gè)模板, 這些模板使用Label和TextBox Web控件來(lái)呈現(xiàn)從ObjectDataSource返回的數(shù)據(jù). 因?yàn)槲覀冎恍枰@示供應(yīng)商信息, 可以移除InsertItemTemplate 和 EditItemTemplat模板. 然后,編輯ItemTemplate模板,使它在標(biāo)簽中顯示供應(yīng)商的公司名稱, 在公司名稱下面顯示地址,城市,國(guó)家和電話號(hào)碼. 另外你也可以手工設(shè)置 FormView的 DataSourceID和創(chuàng)建ItemTemplate的標(biāo)記. 就像我們

17、在后面”使用ObjectDataSource顯示數(shù)據(jù)”一篇中的所作的那樣.修改后,Formview的標(biāo)記看起來(lái)應(yīng)該是這樣:?123456789101112<asp:FormView ID="FormView1" runat="server" DataKeyNames="SupplierID" DataSourceID="suppliersDataSource" EnableViewState="False"><ItemTemplate><h3><%# E

18、val("CompanyName") %></h3><p><asp:Label ID="AddressLabel" runat="server" Text='<%# Bind("Address") %>'></asp:Label><br /><asp:Label ID="CityLabel" runat="server" Text='<%# Bind("

19、City") %>'></asp:Label>,<asp:Label ID="CountryLabel" runat="server" Text='<%# Bind("Country") %>'></asp:Label><br />Phone:<asp:Label ID="PhoneLabel" runat="server" Text='<%# Bind("Ph

20、one") %>'></asp:Label></p></ItemTemplate></asp:FormView>圖16顯示了包含了供應(yīng)商信息后的ProductsForSupplierDetails.aspx頁(yè)面截屏.圖16: 包含供應(yīng)商概括信息的產(chǎn)品列表為ProductsForSupplierDetails.aspx 用戶界面應(yīng)用些小技巧.要改善該報(bào)表的用戶體驗(yàn), 應(yīng)該給ProductsForSupplierDetails.aspx頁(yè)面添加點(diǎn)東西. 現(xiàn)在用戶從ProductsForSupplierDetails.as

21、px回到供應(yīng)商列表頁(yè)面的唯一方法是單擊瀏覽器的后退按鈕. 讓我們給ProductsForSupplierDetails.aspx增加一個(gè)HyperLink控件, 該控件指向SupplierListMaster.aspx, 這樣就給用戶提供了另外一個(gè)回到供應(yīng)商列表的方法.圖17: 增加一個(gè)HyperLink 控件讓用戶可以回到SupplierListMaster.aspx如果用戶單擊了某個(gè)供應(yīng)商的”查看產(chǎn)品”鏈接,而該供應(yīng)商又沒(méi)有任何產(chǎn)品, ProductsForSupplierDetails.aspx 上的ProductsBySupplierDataSource ObjectDataSource將不會(huì)返回任何結(jié)果. 綁定到ObjectDataSource的GridView不會(huì)呈