Gridview数据控件的七种字段类型
9.8 ?數(shù)據(jù)控件的七種字段類型(Fields Type)的應(yīng)用
GridView共支持七種字段類型,字段原本應(yīng)該叫“Column”比較恰當(dāng),但ASP.NET 2.0卻采用另一個(gè)名稱“Field”來(lái)表示,對(duì)于名稱的命名祭司認(rèn)為有點(diǎn)不直觀,因?yàn)椴幻鞯娜丝戳烁静恢繤ield代表什么東西,但既然ASP.NET 2.0使用了Field,各位就遷就一下,表9-6為GridView支持七種字段類型的說(shuō)明。
表9-6 ?GridView字段Field類型表
| Field字段類型 | 說(shuō)? 明 |
| BoundField(數(shù)據(jù)綁定字段) | 將Data Source數(shù)據(jù)源的字段數(shù)據(jù)以文本方式顯示 |
| ButtonField(按鈕字段) | 在數(shù)據(jù)綁定控件中顯示命令按鈕。根據(jù)控件的不同,它可讓您顯示具有自定義按鈕控件(例如【添加】或【移除】按鈕)的數(shù)據(jù)行或數(shù)據(jù)列,按下時(shí)會(huì)引發(fā)RowCommand事件 |
| CommandField(命令字段) | 顯示含有命令的Button按鈕,包括了Select、Edit、Update、Delete命令按鈕(DetailsView的CommandField才支持Insert命令) |
| CheckBoxField(CheckBox字段) | 顯示為CheckBox類型,通常用于布爾值True/False的顯示 |
| HyperLinkField(超鏈接字段) | 將Data Source數(shù)據(jù)源字段數(shù)據(jù)顯示成HyperLink超級(jí)鏈接,并可指定另外的NavigateUrl超鏈接 |
| ImageField(圖像字段) | 在數(shù)據(jù)綁定控件中顯示圖像字段 |
| TemplateField(模板字段) | 顯示用戶自定義的模板內(nèi)容 |
而Field字段聲明在GridView中是被包含在<Columns>...</Columns>標(biāo)簽區(qū)塊中,請(qǐng)參考范例9-1完成后的HTML程序,以下為<Columns>區(qū)塊聲明:
<asp:GridView ID=”GridView1” runat=”server” AutoGenerateColumns=”False” DataKeyNames=”EmployeeID” DataSourceID=”SqlDataSource1” EmptyDataText=”沒(méi)有數(shù)據(jù)記錄可顯示。”>
??? <Columns>
??????? <asp:BoundField DataField=”EmployeeID” HeaderText=”EmployeeID”
??????? ReadOnly=”True” SortExpression=”EmployeeID” />
??????? <asp:BoundField DataField=”LastName” HeaderText=”LastName”
??????? SortExpression=”LastName” />
??????? <asp:BoundField DataField=”FirstName” HeaderText=”FirstName”
??????? SortExpression=”FirstName” />
??????? <asp:BoundField DataField=”Address” HeaderText=”Address”
??????? SortExpression=”Address” />
??? </Columns>
</asp:GridView>
由于其HTML聲明使用BoundField字段,可以證明一般數(shù)據(jù)源的字段數(shù)據(jù)值會(huì)以文本方式顯示。
相比較而言,DataGrid 1.0默認(rèn)只支持四種類型:(1)Bound Column,(2)Button Column,(3)HyperLink Column,(4)Template Column。故可以看出以GridView功能較為豐富,應(yīng)用起來(lái)也會(huì)相對(duì)容易;而以字段名稱命名的DataGrid仍沿用Column,GridView則用Field。
注
(1) 以上七種Field字段類型并非只有GridView控件獨(dú)有或獨(dú)享,其他如DetailsView也共享這七種字段類型。
(2)不知各位是否知道為何用“Field”這個(gè)字眼,而非用“Column”,這是因?yàn)槠叻N類型字段主要是由DataControl-Field類派生而來(lái)的,所以字尾都會(huì)帶有Field字眼。
9.8.1? BoundField數(shù)據(jù)綁定字段
BoundField數(shù)據(jù)綁定字段會(huì)將Data Source數(shù)據(jù)源字段值以文本方式顯示。然而B(niǎo)oundField對(duì)象在不同的數(shù)據(jù)綁定控件中會(huì)有不同的顯示方式,如在GridView控件中顯示BoundField對(duì)象為數(shù)據(jù)列,而DetailsView控件會(huì)將其顯示為數(shù)據(jù)行。
BoundField屬性共分為五大類,說(shuō)明如表9-7和圖9-7所示。
表9-7 ?BoundField屬性分類
| 五大類型屬性 | 說(shuō)? 明 |
| 可訪問(wèn)性(Accessibility) | 設(shè)置AccessibleHeaderText |
| 外觀(Appearance) | 設(shè)置如HeaderText、FooterText、HeaderImageUrl |
| 行為(Behavior) | 設(shè)置行為屬性,其中大多為布爾值True/False |
| 數(shù)據(jù)(Data) | 設(shè)置數(shù)據(jù)源字段與字符串格式化 |
| 樣式(Style) | 設(shè)置顏色、字體等樣式屬性,包括ControlStyle、HeaderStyle、FooterStyle、ItemStyle樣式 |
圖9-7 ?BoundField屬性分類
l? BoundField數(shù)據(jù)綁定字段屬性列表
表9-8為BoundField數(shù)據(jù)綁定字段的重要屬性說(shuō)明。
表9-8 ?BoundField字段重要屬性
| 屬? 性 | 說(shuō)? 明 |
| DataField | 指定對(duì)應(yīng)Data Source數(shù)據(jù)字段 |
| DataFormatString | 顯示文本的字符串格式化,如顯示成貨幣、科學(xué)符號(hào) |
| SortExpression | 設(shè)置字段的排序鍵值 |
| ConvertEmptyStringToNull | 將Empty字符串轉(zhuǎn)換為Null值,應(yīng)用于當(dāng)Update的數(shù)據(jù)屬于Empty字符串時(shí),將它轉(zhuǎn)換為Null值 |
| NullDisplayText | 當(dāng)欲顯示的字段數(shù)據(jù)為Null值時(shí),則以自定義的標(biāo)題文本來(lái)顯示 |
| ApplyFormatInEditMode | 當(dāng)處于編輯模式時(shí),是否套用格式化 |
| HtmlEncode | 是否進(jìn)行HtmlEncode編碼 |
| InsertVisible | 當(dāng)處于Insert模式時(shí),字段是否可見(jiàn) |
以下針對(duì)BoundField重要屬性作更進(jìn)一步的說(shuō)明:
l? BoundField數(shù)據(jù)屬性
w? 若要指定在BoundField對(duì)象中顯示的字段,可以設(shè)置DataField屬性為數(shù)據(jù)字段的名稱。
w? 若要自定義字段字符串的格式,可以通過(guò)設(shè)置DataFormatString屬性,后面會(huì)教各位如何自定義DataFormatString格式。
l? BoundField行為屬性
w? 顯示字段值之前,將HtmlEncode屬性設(shè)置為True(默認(rèn)為True),可對(duì)此字段值進(jìn)行HTML編碼,這樣可防止惡意的程序代碼。
w? 默認(rèn)只有在數(shù)據(jù)綁定控件處于只讀模式時(shí),才可以將格式字符串套用至字段值。若要在數(shù)據(jù)綁定控件處于編輯模式時(shí)將格式字符串套用至顯示的值,請(qǐng)將ApplyFormatInEditMode屬性設(shè)置為True。
w? BoundField還可以針對(duì)null或空字符串進(jìn)行處理,例如字段值若為null,則可通過(guò)設(shè)置NullDisplayText屬性顯示自定義標(biāo)題,或?qū)onvertEmptyStringToNull屬性設(shè)置為True,BoundField對(duì)象還可自動(dòng)將空字符串("")字段值轉(zhuǎn)換為null值。不像在ASP.NET 1.1中若遇到null值數(shù)據(jù)綁定會(huì)產(chǎn)生異常錯(cuò)誤而當(dāng)?shù)?#xff0c;必須自行花費(fèi)一番功夫來(lái)處理null值的數(shù)據(jù)防呆。
l? BoundField樣式屬性
w? 通過(guò)ControlStyle可設(shè)置BoundField字段服務(wù)器子控件的樣式。
w? 通過(guò)FooterStyle可設(shè)置BoundField字段之頁(yè)尾的樣式。
w? 通過(guò)HeaderStyle可設(shè)置BoundField字段之頁(yè)首的樣式。
w? 通過(guò)ItemStyle可設(shè)置BoundField字段中數(shù)據(jù)項(xiàng)的樣式。
?范例9-3? 使用BoundField數(shù)據(jù)綁定字段
本范例將說(shuō)明BoundField數(shù)據(jù)綁定字段的應(yīng)用,例如直接將數(shù)據(jù)表字段拖曳到設(shè)計(jì)界面所產(chǎn)生的GridView的文本字段就是以BoundField字段來(lái)呈現(xiàn),請(qǐng)參考BoundField.aspx程序,以下為步驟說(shuō)明。
? 拖曳數(shù)據(jù)表創(chuàng)建GridView
請(qǐng)直接從Northwind數(shù)據(jù)庫(kù)的Products數(shù)據(jù)表點(diǎn)擊數(shù)據(jù)表字段拖曳到設(shè)計(jì)界面(見(jiàn)圖9-8)。
圖9-8 ?拖曳數(shù)據(jù)表創(chuàng)建GridView
? GridView自動(dòng)格式化設(shè)置
由于原始的GridView控件太單調(diào),故請(qǐng)點(diǎn)擊GridView智能標(biāo)簽的【自動(dòng)套用格式】,再選取其中一種方案樣式即可變成較為美麗之外觀(見(jiàn)圖9-9)。
? 編輯BoundField字段
若要編輯BoundField字段相關(guān)屬性,請(qǐng)點(diǎn)擊GridView智能標(biāo)簽的【編輯列】進(jìn)行字段的編輯,進(jìn)去之后可以看到左邊四個(gè)字段正是BoundField字段類型,接著隨意點(diǎn)擊一個(gè)BoundField字段(ProductID)右側(cè)就會(huì)出現(xiàn)相關(guān)屬性(見(jiàn)圖9-10)。
圖9-9? GridView自動(dòng)套用格式設(shè)置
圖9-10 ?編輯BoundField字段
? 修改BoundField字段標(biāo)題文字
由于GridView的BoundField字段標(biāo)題文字是英文的,而我們打算用中文來(lái)取代,故請(qǐng)修改BoundField字段的HeaderText屬性,修改如下:
l? 請(qǐng)將ProducID字段的HeaderText改為“產(chǎn)品代號(hào)”。
l? 請(qǐng)將ProducName字段的HeaderText改為“產(chǎn)品名稱”。
l? 請(qǐng)將CategoryID字段的HeaderText改為“種類代號(hào)”。
l? 請(qǐng)將UnitPrice字段的HeaderText改為“單位價(jià)格”。
以上只簡(jiǎn)單示范BoundField字段屬性要如何修改,其他屬性修改方式也是在此完成的,最后請(qǐng)運(yùn)行程序,運(yùn)行結(jié)果如圖9-11所示。
圖9-11? BoundField字段運(yùn)行界面
9.8.2? 標(biāo)準(zhǔn)數(shù)值格式化字符串(Standard Numeric Format Strings)
前面曾提到BoundField數(shù)據(jù)綁定提供DataFormatString字符串格式化功能,可以在不變動(dòng)原始數(shù)據(jù)數(shù)字或格式的情況下將數(shù)據(jù)顯示成另一種格式。但是DataFormatString不過(guò)就是一個(gè)窗口而已,它必須通過(guò).NET 1.0原本就存在的機(jī)制叫“標(biāo)準(zhǔn)數(shù)值格式化字符串”來(lái)完成,表9-9為標(biāo)準(zhǔn)數(shù)值格式化字符串所支持的參數(shù)。
表9-9? 標(biāo)準(zhǔn)數(shù)值格式化字符串
| 格式代號(hào) | 說(shuō)? 明 | 原始格式 | 格式指令 | 運(yùn)行結(jié)果 |
| {0:C} | 顯示貨幣符號(hào)格式 | 2005.5 | {0:C2} | NT$2,005.50 |
| {0:D} | 顯示十進(jìn)制數(shù)格式(限用于整數(shù)) | 128 | {0:D} | 128 |
| {0:E} | 顯示科學(xué)符號(hào)格式 | 2005.5 | {0:E2} | 2.01E+003 |
| {0:F} | 顯示固定小數(shù)字?jǐn)?shù)格式 | 2005.5 | {0:F4} | 2005.5000 |
| {0:G} | 顯示一般格式 | 2005.5 | {0:G} | 2005.5 |
| {0:N} | 顯示有逗號(hào)固定小數(shù)字?jǐn)?shù)格式 | 2005.5 | {0:N3} | 2,005.500 |
| {0:P} | 顯示百分比格式 | 0.25 | {0:P} | 25.00% |
| {0:X} | 顯示十六進(jìn)制數(shù)格式(限用于整數(shù)) | 128 | {0:X} | 80 |
| {0:#} | 顯示自定義的數(shù)字格式 | 2005.5 | {0:00####.00} | 002005.00 |
?范例9-4 ?標(biāo)準(zhǔn)數(shù)值格式化字符串(Standard Numeric Format Strings)的應(yīng)用
在了解了標(biāo)準(zhǔn)數(shù)值格式化字符串的方式后,您才能將此技巧套用到BoundField字段的DataFormatString屬性來(lái)格式化字符串,故請(qǐng)先參考FormatStrings.aspx程序,以下為程序代碼:
01? Partial Class FormatStrings
02? ??? Inherits System.Web.UI.Page
03?
04? ??? Protected Sub Page_Load(ByVal sender As Object, ByVal e As?
?????????? System.EventArgs) Handles Me.Load
05? ??????? Dim x As Double = 2005.5
06? ??????? Dim y As Integer = 128
07? ??????? Dim z As Double = 0.25
08?
09? ??????? Response.Write(x.ToString() & "? 以C2格式化之后? " & ?????????
??????????????? String.Format("{0:C2}", x) & "<BR>")
10? ??????? Response.Write(y.ToString() & "? 以D格式化之后? " & ??????
??????????????? String.Format("{0:D}", y) & "<BR>")
11? ??????? Response.Write(x.ToString() & "? 以E2格式化之后? " &
??????????????? String.Format("{0:E2}", x) & "<BR>")
12? ??????? Response.Write(x.ToString() & "? 以F4格式化之后? " &
??????????????? String.Format("{0:F4}", x) & "<BR>")
13? ??????? Response.Write(x.ToString() & "? 以G格式化之后? " & ??????
??????????????? String.Format("{0:G}", x) & "<BR>")
14? ??????? Response.Write(x.ToString() & "? 以N3格式化之后? " & ?????????
??????????????? String.Format("{0:N3}", x) & "<BR>")
15? ??????? Response.Write(z.ToString() & "? 以P格式化之后? " & ??????
??????????????? String.Format("{0:P}", z) & "<BR>")
16? ??????? Response.Write(y.ToString() & "? 以X格式化之后? " & ?
??????????????? String.Format("{0:X}", y) & "<BR>")
17? ??????? Response.Write(x.ToString() & "? 以00####.00格式化之后? " &
??????????????? String.Format("{0:00####.00}", x) & "<BR>")
18? ??? End Sub
19? End Class
完成后請(qǐng)運(yùn)行程序,運(yùn)行界面如圖9-12所示。
圖9-12 ?標(biāo)準(zhǔn)數(shù)值格式化字符串運(yùn)行界面
注
(1)格式英文指令不分大小寫(xiě)。
(2) 標(biāo)準(zhǔn)數(shù)值格式化字符串并不限定類型項(xiàng)目才能使用,而是整個(gè).NET都可以應(yīng)用,所以Console、ASP.NET到Win Form都能使用。
?范例9-5 ?BoundField字段DataFormatString字符串格式化的應(yīng)用
圖9-13是GridView控件顯示Northwind數(shù)據(jù)庫(kù)Product數(shù)據(jù)表的原始格式,本范例說(shuō)明如何將標(biāo)準(zhǔn)數(shù)值格式化字符串設(shè)置在BoundField字段的DataFormatString屬性,以格式化原始數(shù)據(jù),請(qǐng)參考BoundFieldFormat.aspx程序,步驟說(shuō)明如下。
圖9-13? Products數(shù)據(jù)表原始顯示格式
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)從工具箱中拖曳一個(gè)GridView及SqlDataSource控件到設(shè)計(jì)界面,并在GridView的智能標(biāo)簽中選擇數(shù)據(jù)源為“SqlDataSource1”(見(jiàn)圖9-14)。
圖9-14 ?創(chuàng)建GridView及SqlDataSource控件
? 設(shè)置GridView外觀樣式
請(qǐng)?jiān)贕ridView智能標(biāo)簽中的自動(dòng)格式化選擇一個(gè)外觀樣式。
? 設(shè)置SqlDataSource數(shù)據(jù)庫(kù)連接
GridView要能夠顯示數(shù)據(jù)庫(kù)數(shù)據(jù)最重要的助手莫過(guò)于SqlDataSource數(shù)據(jù)源控件,故請(qǐng)?jiān)赟qlDataSource的智能標(biāo)簽中選擇【配置數(shù)據(jù)源】→【新建連接】→在添加連接的對(duì)話框中輸入SQL Server服務(wù)器名、用戶名、密碼和數(shù)據(jù)庫(kù)名稱,完成后請(qǐng)按【測(cè)試連接】按鈕,若設(shè)置正確,則會(huì)產(chǎn)生測(cè)試連接成功消息(見(jiàn)圖9-15)。
圖9-15 ?設(shè)置SqlDataSource數(shù)據(jù)庫(kù)連接
? 保存數(shù)據(jù)庫(kù)連接字符串
設(shè)置完數(shù)據(jù)庫(kù)連接后請(qǐng)點(diǎn)擊【下一步】按鈕,系統(tǒng)會(huì)詢問(wèn)你“是否將連接保存到應(yīng)用程序配置文件中?”,并要求您提供命名“NorthwindConnectionString”(見(jiàn)圖9-16)。
圖9-16? 保存數(shù)據(jù)庫(kù)連接字符串
各位別小看這個(gè)存儲(chǔ)小操作,我反問(wèn)你,它是存儲(chǔ)在哪?又有什么用途?
(1)它會(huì)將剛才的數(shù)據(jù)庫(kù)連接設(shè)置保存在Web.config配置文件中,設(shè)置如下:
<configuration>
??? <connectionStrings>
??????? <add name=”NorthwindConnectionString” connectionString=”Data
??????? Source=localhost;Initial Catalog=Northwind;User ID=
??????? sa;Password=test” providerName=”System.Data.SqlClient” />
??? </connectionStrings>
<configuration>
(2)有什么用途呢?就是ADO.NET可以讀取這個(gè)數(shù)據(jù)庫(kù)連接設(shè)置,您就無(wú)須再在每個(gè)Web Form中重復(fù)聲明,將來(lái)數(shù)據(jù)庫(kù)帳號(hào)密碼一更改,每張Web Form又要一一調(diào)出來(lái)修改。讀取程序如下(請(qǐng)參考第2章范例2-4):
string connString =ConfigurationManager.ConnectionStrings [”NorthwindConnectionString”].ConnectionString;
(3)若您擔(dān)心數(shù)據(jù)庫(kù)連接的帳號(hào)及密碼曝光,可用第2章2.9節(jié)的加密技巧:
aspnet_regiis -pe “connectionStrings” -app “/07GridView” -prov “RSAProtectedConfigurationProvider”
? 設(shè)置SqlDataSource的Select、Insert、Update與Delete命令
請(qǐng)選擇Products數(shù)據(jù)源,并勾選星號(hào)(*)以讀取所有的數(shù)據(jù)庫(kù)字段,然而這樣只會(huì)產(chǎn)生出Select命令,若您還想要Insert、Update與Delete語(yǔ)法,則必須按【高級(jí)】按鈕將“生成INSERT、UPDATE和DELETE語(yǔ)句”(必要)及“使用開(kāi)放式并發(fā)”(選擇性)打鉤(見(jiàn)圖9-17)。
圖9-17? 配置SqlDataSource的SQL命令
? 編輯DataFormatString格式化
請(qǐng)?jiān)贕ridView智能標(biāo)簽中點(diǎn)擊【編輯數(shù)據(jù)列】進(jìn)入編輯模式,請(qǐng)依照表9-10將相關(guān)字段的DataFormatString及HtmlEncode屬性設(shè)置為False(見(jiàn)圖9-18)。
表9-10 ?字段格式化設(shè)置
| 字? 段 | 格式化字符串 | HtmlEncode屬性 |
| ProductID | {0:000#} | False |
| SupplierID | {0:0#} | False |
| CategoryID | {0:00#} | False |
| QuantityPerUnit | {0:N1} | False |
| UnitPrice | {0:C2} | False |
| UnitsInStock | {0:00##} | False |
| UnitsOnOrder | {0:0#} | False |
| RecorderLevel | {0:00} | False |
圖9-18 ?編輯DataFormatString格式化
設(shè)置完成后請(qǐng)按【F5】運(yùn)行,在圖9-19格式化結(jié)果與原始圖片對(duì)照下,各位應(yīng)能明顯察覺(jué)格式已按照我們所給定的參數(shù)來(lái)顯示了。
圖9-19? Products數(shù)據(jù)表格式化結(jié)果
本范例表面上在講格式化,但實(shí)則一并講解了許多重要知識(shí),包括數(shù)據(jù)庫(kù)連接設(shè)置、儲(chǔ)存位置、ADO.NET連接字符串的讀取、連接字符串的加密等,各位可以細(xì)細(xì)體會(huì)本范例。
?提醒
(1)BoundField字段的格式化必須將“HtmlEncode”屬性設(shè)置為False(默認(rèn)為True),若不改為False,則格式化是起不了任何作用的;但是HtmlEncode屬性默認(rèn)為True并不是沒(méi)有原因的,目的是為防止惡意的Client Script程序破壞ASP.NET系統(tǒng),如果不需要格式化則請(qǐng)維持HtmlEncode屬性為True。
(2)記得將自動(dòng)生成字段CheckBox打鉤移除,否則字段會(huì)重復(fù)產(chǎn)生。
9.8.3 ?ButtonField按鈕字段
ButtonField是在GridView字段中顯示Button按鈕(例如自定義的添加、刪除按鈕),并且當(dāng)按下Button按鈕時(shí)會(huì)引發(fā)“RowCommand”事件,在此事件中可以加入自定義的程序代碼,比如說(shuō)產(chǎn)品數(shù)據(jù)的訂購(gòu)、刪除或取消的按鈕。然而,ButtonField對(duì)象在不同的數(shù)據(jù)綁定控件中會(huì)有不同的顯示方式,如在GridView控件中顯示BoundField對(duì)象為數(shù)據(jù)列,而DetailsView控件會(huì)將其顯示為數(shù)據(jù)行。
l? ButtonField按鈕字段屬性列表
ButtonField屬性與前面的BoundField屬性大致上相同,僅就不同的重要屬性加以說(shuō)明(見(jiàn)表9-11)。
表9-11 ?ButtonField按鈕字段重要屬性
| 屬? 性 | 說(shuō)? 明 |
| ButtonType | ButtonField字段共支持三種按鈕形式:Button、Image、Link |
| DataTextField | 將數(shù)據(jù)源字段數(shù)據(jù)綁定到Button按鈕的文本屬性中 |
| DataTextFormatString | 將DataTextField數(shù)據(jù)源字段值加以格式化 |
| ImageUrl | 當(dāng)按鈕形式為Image時(shí),指定Image所在的Url |
| CauseValidation | 單擊按鈕時(shí)是否會(huì)引發(fā)Validation控件驗(yàn)證 |
| CommandName | 單擊ButtonField按鈕時(shí)所要運(yùn)行的命令名稱 |
| ValidationGroup | ButtonField按鈕所要引發(fā)的Validation Group名稱 |
ButtonField按鈕字段重要屬性與事件補(bǔ)充說(shuō)明:
l? 當(dāng)ButtonField按鈕字段被按下時(shí),GridView控件會(huì)引發(fā)RowCommand事件,而DetailsView控件會(huì)引發(fā)ItemCommand事件。
l? 若要判斷引發(fā)命令事件之?dāng)?shù)據(jù)行的索引,請(qǐng)使用事件自變量的CommandArgument屬性,會(huì)將該事件自變量傳遞至數(shù)據(jù)綁定控件的命令事件,ButtonField類會(huì)自動(dòng)用適當(dāng)?shù)乃饕堤钊隒ommandArgument屬性。
l? 若指定要顯示的按鈕類型,請(qǐng)使用ButtonType屬性。當(dāng)顯示連接或命令按鈕時(shí),請(qǐng)使用Text屬性,以指定要在按鈕中顯示的標(biāo)題。如果設(shè)置Text屬性,則ButtonField中的所有按鈕都共享相同標(biāo)題。
l? 您可以將數(shù)據(jù)源字段數(shù)據(jù)綁定到Button按鈕的文本屬性,這樣ButtonField按鈕便能夠顯示不同標(biāo)題,方式是設(shè)置DataTextField屬性,若需要格式化,則設(shè)置DataTextFormatString屬性。
l? ButtonField按鈕字段可設(shè)置的樣式屬性(Style)也同樣有ControlStyle、FooterStyle、HeaderStyle、ItemStyle這四大類。
?范例9-6 ?使用ButtonField按鈕字段
本范例將教您如何使用ButtonField字段來(lái)構(gòu)建Button按鈕,以及與Button按鈕字段相關(guān)屬性的設(shè)置,請(qǐng)參考ButtonField.aspx程序,步驟說(shuō)明如下:
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)創(chuàng)建GridView及SqlDataSource控件,并將GridView的ID屬性命名為“gviewProduct”,SqlDataSource數(shù)據(jù)源請(qǐng)指定北風(fēng)數(shù)據(jù)庫(kù)的Products數(shù)據(jù)表中的ProductID、ProductName、UnitPrice三個(gè)數(shù)據(jù)字段,最后再指定GridView的數(shù)據(jù)源為SqlDataSource控件(為節(jié)省頁(yè)面設(shè)置細(xì)節(jié)祭司不再一一列出,若您不熟悉,請(qǐng)參考上一個(gè)范例的詳細(xì)步驟說(shuō)明)。
?提醒
在此祭司建議初期盡量不要用服務(wù)器資源管理器或數(shù)據(jù)庫(kù)資源管理器直接拖曳數(shù)據(jù)字段到Web Form設(shè)計(jì)界面,因?yàn)槟菢雍苋菀讓?dǎo)致您對(duì)GridView與SqlDataSource的認(rèn)識(shí)不夠深刻,而那種生澀感也會(huì)反饋到程序設(shè)計(jì)時(shí)的概念不夠清楚;但等您通過(guò)了GridView與SqlDataSource之后,任何快速完成的向?qū)梢噪S意大量使用。
? 添加ListBox控件
請(qǐng)?zhí)砑右粋€(gè)ListBox控件,并將其屬性改為“l(fā)bOrder”,這是為了顯示Button按鈕所訂購(gòu)的產(chǎn)品信息。
? 添加ButtonField字段
請(qǐng)?jiān)贕ridView智能標(biāo)簽中點(diǎn)擊【編輯列】進(jìn)入編輯模式,先選擇左上角的ButtonField字段類型,接著再點(diǎn)擊【添加】按鈕添加兩個(gè)ButtonField命令按鈕字段(見(jiàn)圖9-20),屬性設(shè)置如下:
圖9-20 ?添加ButtonField按鈕字段
l? 請(qǐng)將第一個(gè)Button按鈕字段,Text屬性設(shè)置為“訂購(gòu)”,ButtonType屬性設(shè)置為“Button”,最后將CommandName屬性設(shè)為“Order”。
l? 請(qǐng)將第一個(gè)Button按鈕字段,Text屬性設(shè)置為“取消”,ButtonType屬性設(shè)置為“Button”,最后將CommandName屬性設(shè)為“CancelOrder”。
注
CommandName屬性設(shè)置是為了讓程序設(shè)計(jì)判斷,用戶到底點(diǎn)擊的是訂購(gòu)(Order)還是取消(CancelOrder)。
? 調(diào)整Button按鈕字段順序
圖9-21左半部系統(tǒng)會(huì)默認(rèn)產(chǎn)生所建立的Button按鈕,您可能需要調(diào)整字段的順序,將Button按鈕調(diào)整為在GridView右側(cè)(見(jiàn)圖9-21)。
圖9-21 ?ButtonField字段順序的調(diào)整
該怎么做呢?字段順序一樣是在GridView智能標(biāo)簽的【編輯列】中進(jìn)行,請(qǐng)將ProductID、ProductName與UnitPrice三個(gè)BoundField字段一并【添加】到左下角的選取字段,而被選取的字段才能夠進(jìn)行調(diào)整,調(diào)整方式是選取字段后按向上及向下的圖標(biāo),待字段調(diào)整好后單擊【確定】按鈕結(jié)束(見(jiàn)圖9-22)。
圖9-22 ?調(diào)整字段順序
?提醒
請(qǐng)將“自動(dòng)生成字段”取消選擇,字段才不會(huì)重復(fù)產(chǎn)生兩次。
? 添加RowCommand事件程序
當(dāng)點(diǎn)擊Button按鈕時(shí),會(huì)引發(fā)GridView的RowCommand事件,在此事件中可以添加自定義的程序(例如點(diǎn)擊訂購(gòu)按鈕時(shí)加入購(gòu)物車的購(gòu)物籃),而在此將會(huì)利用到STEP 3中所設(shè)置的CommandName屬性,RowCommand事件程序如下:
01?? '創(chuàng)建GridView Button按鈕的RowCommand事件
02?? Protected Sub gviewProduct_RowCommand(ByVal sender As Object, ByVal e As
?????? System.Web.UI.WebControls.GridViewCommandEventArgs) Handles ? ?
?????? gviewProduct.RowCommand
03?????? '獲取哪個(gè)Row的行索引
04?????? Dim index As Integer = CType(e.CommandArgument, Int32)
05?????? Dim selectedRow As GridViewRow = gviewProduct.Rows(index)
06?????? '獲取該行Row的字段產(chǎn)品名稱代號(hào)
07?????? Dim productName As TableCell = selectedRow.Cells(1)
08?????? '判斷用戶按下的是哪個(gè)種類的按鈕
09?????? Select Case e.CommandName
10?????????? Case "Order"
11?????????????? '將訂購(gòu)的產(chǎn)品名稱加入ListBox
12?????????????? lbOrder.Items.Add(productName.Text)
13?????????? Case "CancelOrder"
14?????????????? '將取消的產(chǎn)品名稱自ListBox移除
15?????????????? If (lbOrder.Items.Count > 0) Then
16???????????????? ??Dim i As Integer = 0
17??
18?????????????????? Do While (i <= lbOrder.Items.Count - 1)
19?????????????????????? If (lbOrder.Items(i).Text = productName.Text) Then
20?????????????????????????? lbOrder.Items.Remove(lbOrder.Items(i))
21??????????????????? ???????Exit Do
22?????????????????????? Else
23?????????????????????????? i += 1
24?????????????????????? End If
25?????????????????? Loop
26?????????????? End If
27?????? End Select
28?? End Sub
程序說(shuō)明:
(1)e.CommandArgument是取得按下ButtonField按鈕字段所在的行索引,以便判斷是哪行被按下ButtonField按鈕,再通過(guò)此索引來(lái)取得實(shí)際GridViewRow對(duì)象(數(shù)據(jù)行),而以GridViewRow.Cell(1)索引來(lái)取得ProductName字段值,進(jìn)而顯示在ListBox中。
(2)?? e.CommandName是BoundField字段中的CommandName屬性(Order或CancelOrder)設(shè)置值,這兩個(gè)參數(shù)的搭配應(yīng)用實(shí)際上只是為了識(shí)別ButtonField按鈕字段坐標(biāo),因?yàn)镚ridView中有一堆按鈕,系統(tǒng)根本無(wú)從知道用戶按下哪個(gè)按鈕,故通過(guò)e.CommandArgument取得Y軸坐標(biāo)(Row),而e.CommandName取得X軸坐標(biāo)(Column),有了X與Y坐標(biāo),便能夠精準(zhǔn)定位識(shí)別到底是哪一個(gè)按鈕被按下,而該運(yùn)行什么操作。運(yùn)行結(jié)果如圖9-23所示。
圖9-23? ButtonField按鈕字段運(yùn)行界面
?范例9-7? ButtonField按鈕字段的格式化
上一個(gè)范例的所有Button按鈕統(tǒng)一命名為“訂購(gòu)”與“取消”,若想要每個(gè)按鈕都能顯示不同的文字信息,該如何做呢?本范例是對(duì)前一個(gè)范例的稍加修改,主要設(shè)置了訂購(gòu)與取消兩個(gè)按鈕之DataTextField與DataTextFormatString,請(qǐng)參考ButtonFieldFormat.aspx程序,概要說(shuō)明如下:
l? 將訂購(gòu)Button按鈕的DataTextField屬性設(shè)置為“ProductName”,DataTextFormatString屬性設(shè)置為“訂購(gòu):{0}”,ControlStyle的Width屬性設(shè)置為“200px”。
l? 將取消Button按鈕的DataTextField屬性設(shè)置為“ProductName”,DataTextFormatString屬性設(shè)置為“取消:{0}”,ControlStyle的Width屬性設(shè)置為“200px”。運(yùn)行結(jié)果如圖9-24所示。
圖9-24? ButtonField按鈕字段格式化運(yùn)行界面
9.8.4 ?CommandField命令按鈕字段
CommandField命令按鈕字段是顯示預(yù)先定義好的按鈕來(lái)運(yùn)行Select、Edit、Update、Delete與Insert(DetailsView才支持Insert)的命令,因其具有運(yùn)行命令的功能,故命名為“CommandField”,CommandField由于具備了以上諸多命令功能,故其能力與重要性遠(yuǎn)超過(guò)其他類型字段。
而外觀上CommandField跟ButtonField很像,所以別被外觀所混淆,兩者之間最大的差異在于ButtonField只是單純地顯示Button按鈕而不具備內(nèi)置的命令,所以ButtonField必須自行撰寫(xiě)相關(guān)程序,反倒是善用CommandField內(nèi)置的命令字段可以省掉各位不少寫(xiě)程序代碼的力氣。
CommandField命令字段的重要屬性說(shuō)明。
l? GridView控件的CommandField命令按鈕字段支持【編輯、更新、取消】、【選取】與【刪除】三種命令按鈕;而DetailsView的CommandField命令按鈕字段則支持【編輯、更新、取消】、【刪除】與【添加、插入、取消】三種命令按鈕。
l? 顯示及隱藏命令按鈕您可以設(shè)置ShowDeleteButton、ShowEditButton、ShowInsertButton與ShowSelectButton這幾個(gè)屬性(True或False)。
l? 而設(shè)置不同命令按鈕的文字標(biāo)題可用的屬性有SelectText、InsertText、UpdateText、DeleteText、CancelText、EditText、NewText。
l? 若您將ButtonType屬性設(shè)為ButtonType.Image,則可以設(shè)置按鈕的圖像Url屬性,可供使用的有CancelImageUrl、DeleteImageUrl、EditImageUrl、InsertText、NewImageUrl、SelectImageUrl、UpdateImageUrl。
l? CommandField命令按鈕字段可設(shè)置的樣式屬性(Style)也同樣有ControlStyle、FooterStyle、HeaderStyle、ItemStyle這四大類。
?范例9-8? 使用CommandField命令按鈕字段
本范例將教您如何使用CommandField來(lái)建立命令按鈕字段,以及與CommandField命令按鈕字段相關(guān)屬性的設(shè)置,請(qǐng)參考CommandField.aspx程序,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)創(chuàng)建GridView及SqlDataSource控件,并將GridView的ID屬性命名為“gviewProduct”,SqlDataSource數(shù)據(jù)源請(qǐng)指定北風(fēng)數(shù)據(jù)庫(kù)的Products數(shù)據(jù)表中的ProductID、ProductName、UnitPrice、UnitsInStock四個(gè)數(shù)據(jù)字段,最后再指定GridView的數(shù)據(jù)源為SqlDataSource控件。但有一點(diǎn)要特別注意的是,若要讓GridView的編輯、刪除與更新起作用,必須要將SqlDataSource控件的SQL選項(xiàng)“生成INSERT、UPDATE和DELETE語(yǔ)句”打鉤才行(見(jiàn)圖9-25)。
圖9-25 ?創(chuàng)建GridView及SqlDataSource控件
? 添加CommandField命令按鈕字段
請(qǐng)?jiān)贕ridView智能標(biāo)簽中點(diǎn)擊【編輯列】進(jìn)入編輯模式,從可用的字段添加【選擇】、【編輯、更新、取消】、【刪除】三個(gè)CommandField命令字段到選取的字段,并將【編輯】與【刪除】?jī)蓚€(gè)命令的ButtonType改為“Button”(見(jiàn)圖9-26)。
圖9-26? 創(chuàng)建CommandField命令按鈕字段
? 啟用GridView命令功能
當(dāng)完成STEP 2后,請(qǐng)?jiān)贕ridView智能標(biāo)簽中啟用【啟用編輯】、【啟用刪除】、【啟用選定內(nèi)容】這三項(xiàng)功能,將其復(fù)選框打鉤(見(jiàn)圖9-27)。
圖9-27 ?啟用GridView命令功能
? 取消GridView刪除數(shù)據(jù)行功能
在此為避免數(shù)據(jù)的誤刪,將取消GridView刪除數(shù)據(jù)行功能,而這項(xiàng)技巧同樣可以運(yùn)用權(quán)限的管理,有刪除權(quán)限的人才能刪除數(shù)據(jù),否則任何刪除操作都將會(huì)被取消,請(qǐng)?jiān)贕ridView的RowDeleting事件中添加下列程序代碼:
01? '取消刪除數(shù)據(jù)行
02? Protected Sub gviewProduct_RowDeleting(ByVal sender As Object, ByVal e As?
?????? System.Web.UI.WebControls.GridViewDeleteEventArgs) Handles ?? ???? ???? ??
?????? gviewProduct.RowDeleting
03? ??? e.Cancel = True
04? ??? 'Literal txtMsg = new Literal();
05? ??? Dim txtMsg As New Literal()
06? ??? txtMsg.Text = "<script>alert('數(shù)據(jù)行刪除取消')</script>"
07? ??? Page.Controls.Add(txtMsg)
08? End Sub
完成后運(yùn)行界面如圖9-28所示。
圖9-28 ?CommandField命令按鈕字段運(yùn)行界面
?秘技放送
在這好向各位傳達(dá)一個(gè)秘技,假設(shè)GridView的數(shù)據(jù)筆數(shù)很多,會(huì)遇到一個(gè)問(wèn)題,就是無(wú)論您點(diǎn)擊【選取】、【編輯】或【刪除】按鈕,網(wǎng)頁(yè)P(yáng)ostback后,界面會(huì)進(jìn)行refresh操作,通常頁(yè)面會(huì)回到瀏覽器最頂端,往往這種現(xiàn)象會(huì)使得用戶必須再滾動(dòng)回到下面原來(lái)的位置,這樣會(huì)造成用戶的困擾,為了克服這個(gè)弱點(diǎn),ASP.NET 2.0提供了“MaintainScrollPositionOnPostback”新屬性,它的功用是網(wǎng)頁(yè)P(yáng)ostback后界面重新refresh,仍會(huì)固定維持在原先的定位,這有什么用處呢?您可以嘗試GridView不要啟用分頁(yè),而瀏覽器顯示GridView界面就會(huì)拉得很長(zhǎng)很長(zhǎng),這時(shí)按下編輯按鈕,如果將這個(gè)屬性設(shè)置為true,則界面會(huì)乖乖地定在原來(lái)位置不會(huì)跑到最頂端,其語(yǔ)法如下:
<%@ Page Language=“VB” MaintainScrollPositionOnPostback=true %>
?范例9-9 ?自定義CommandField命令按鈕字段
如果默認(rèn)的CommandField命令按鈕字段不太符合您的需求,您也可以小幅自定義CommandField命令按鈕字段,例如將編輯與添加按鈕同放在一個(gè)字段,請(qǐng)參考CmmandFieldCustom.aspx程序,步驟略述如下。
? 添加原始CommandField字段
請(qǐng)?zhí)砑觾蓚€(gè)原始CommandField字段,也就是不要選擇任何默認(rèn)好的命令按鈕類型(見(jiàn)圖9-29)。
圖9-29? 自定義CommandField命令按鈕字段
? 設(shè)置ShowButton屬性
在此“ShowButton”屬性是指ShowDeleteButton、ShowEditButton、ShowInsertButton與ShowSelectButton這幾個(gè)屬性,設(shè)置如下:
l? 請(qǐng)將第一個(gè)CommandField命令按鈕字段的ShowEditButton與ShowInsertButton屬性設(shè)為True,ButtonType設(shè)置為“Button”,HeaderText設(shè)為“自定義字段一”。
l? 請(qǐng)將第二個(gè)CommandField命令按鈕字段的ShowDeleteButton與ShowSelectButton屬性設(shè)為True,ButtonType設(shè)置為“Button”,HeaderText設(shè)為“自定義字段二”。完成后運(yùn)行界面如圖9-30所示。
圖9-30 ?自定義CommandField命令按鈕字段運(yùn)行界面
9.8.5? CheckBoxField復(fù)選框字段
CheckBoxField是在GridView字段中加入CheckBox字段,通常用于顯示布爾值,若數(shù)據(jù)源為True,則為勾選狀態(tài),若為False則未勾選;在顯示狀態(tài)下,默認(rèn)CheckBoxField是被Disabled,故呈現(xiàn)的是灰色的只讀狀態(tài),只有在編輯模式時(shí)才會(huì)變成Enabled,才能進(jìn)行修改。
l? CheckBoxField字段重要屬性
許多屬性是各類Field字段共享的,前面已介紹過(guò)的屬性則不再贅述,表9-12為CheckBoxField字段的重要屬性。
表9-12 ?CheckBoxField字段的重要屬性表
| 屬? 性 | 說(shuō)? 明 |
| DataField | 設(shè)置綁定至數(shù)據(jù)源的字段名稱 |
| Text | 可以設(shè)置CheckBox右側(cè)的說(shuō)明文字 |
| ReadOnly | 在編輯模式時(shí),設(shè)置ReadOnly屬性可以防止被編輯 |
?范例9-10? 使用CheckBoxField復(fù)選框字段
本范例說(shuō)明如何建立CheckBoxField復(fù)選框字段來(lái)顯示布爾值字段,請(qǐng)參考CheckBoxField. aspx程序,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)創(chuàng)建GridView及SqlDataSource控件,并將GridView的ID屬性命名為“gviewProduct”,SqlDataSource數(shù)據(jù)源請(qǐng)指定北風(fēng)數(shù)據(jù)庫(kù)的Products數(shù)據(jù)表中的ProdutID、ProductName、UnitPrice、UnitsInStock及Discontinued五個(gè)數(shù)據(jù)字段,最后再指定GridView的數(shù)據(jù)源為SqlDataSource控件。
? 加入CheckBoxField復(fù)選框字段
請(qǐng)?jiān)贕ridView智能標(biāo)簽中點(diǎn)擊【編輯列】進(jìn)入編輯模式,從可用的字段加入ProductID、ProductName、UnitPrice、UnitsInStock四個(gè)BoundField命令字段,及一個(gè)CheckBoxField字段類型的Discontinued到選取的字段,并將Discontinued的Text屬性改為“停止供貨”。
? 加入CommandField命令按鈕字段
接著在編輯模式下加入一個(gè)【編輯、更新、取消】的CommandField命令按鈕字段到選取的字段,目的是為了確認(rèn)CheckBoxField復(fù)選框字段在編輯模式下是可以編輯的,因?yàn)镃heckBoxField字段在顯示模式下是Disabled狀態(tài)(見(jiàn)圖9-31)。
圖9-31? CheckBoxField復(fù)選框字段運(yùn)行界面
9.8.6? HyperLinkField超鏈接字段
HyperLinkField超鏈接字段是將數(shù)據(jù)源字段顯示為超鏈接形式,并且可以另外指定URL字段,以作為導(dǎo)向?qū)嶋H的URL網(wǎng)址。
l? HyperLinkField超鏈接字段重要屬性
許多屬性是各類Field字段共享的,若前面已介紹過(guò)的屬性則不再贅述,表9-13為HyperLinkField超鏈接字段重要屬性說(shuō)明。
表9-13? HyperLinkField超鏈接字段重要屬性表
| 屬? 性 | 說(shuō)? 明 |
| DataTextField | 綁定數(shù)據(jù)源字段顯示成超鏈接文字,可當(dāng)做參數(shù)傳遞到DataTextFormatString屬性之中格式化 |
| DataTextFormatString | DataText字段字符串的格式化,請(qǐng)參考表9-9 |
| DataNavigateUrlFields | 將數(shù)據(jù)字段綁定到超鏈接字段Url屬性,可當(dāng)做參數(shù)傳遞到DataNavigateUrlFormatString屬性中格式化 |
| DataNavigateUrlFormatString | DataText字段字符串的格式化,請(qǐng)參考表9-9 |
| Text | 超鏈接字段顯示的文字,若DataTextField屬性沒(méi)有設(shè)置,會(huì)以Text文字顯示 |
?范例9-11 ?使用HyperLinkField超鏈接字段
以下范例是在GridView控件加上一個(gè)HyperLinkField超鏈接字段,點(diǎn)擊超鏈接字段后會(huì)導(dǎo)向另一個(gè)產(chǎn)品明細(xì)的網(wǎng)頁(yè),通過(guò)DetailsView將產(chǎn)品明細(xì)數(shù)據(jù)顯示出來(lái),請(qǐng)參考HyperLinkField.aspx程序,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)創(chuàng)建GridView及SqlDataSource控件,并將GridView的ID屬性命名為“gviewProduct”,SqlDataSource數(shù)據(jù)源請(qǐng)指定北風(fēng)數(shù)據(jù)庫(kù)的Products數(shù)據(jù)表中的ProductName、SupplierID、CategoryID、UnitPrice四個(gè)數(shù)據(jù)字段,最后再指定GridView的數(shù)據(jù)源為SqlDataSource控件。
? 創(chuàng)建HyperLinkField超鏈接字段
請(qǐng)?jiān)贕ridView智能標(biāo)簽中點(diǎn)擊【編輯列】進(jìn)入編輯模式,添加一個(gè)HyperLinkField超鏈接字段,請(qǐng)依表9-14設(shè)置超鏈接字段相關(guān)屬性。
表9-14 ?設(shè)置HyperLinkField超鏈接字段屬性
| 屬? 性 | 設(shè)? 置 |
| HeaderText | 產(chǎn)品明細(xì) |
| Text | 詳細(xì)數(shù)據(jù) |
| DataNavigateUrlFields | ProductName,CategoryID,SupplierID |
| DataNavigateUrlFormatString | ProductDetails.aspx?ProductName={0}&CategoryID={1}&SupplierID={2} |
| DataTextField | ProductName |
| DataTextFormatString | 查看 {0} 的明細(xì) |
這個(gè)范例故意不添加ProductID字段,目的是要示范傳遞多個(gè)參數(shù)到另一個(gè)網(wǎng)頁(yè)的技巧,若使用ProductID字段就無(wú)須使用多個(gè)參數(shù)來(lái)識(shí)別產(chǎn)品的唯一性。而DataNavigateUrlFields屬性接受多個(gè)數(shù)據(jù)字段的參數(shù),并且會(huì)將參數(shù)傳到DataNavigateUrlFormatString所設(shè)置Url網(wǎng)址的 {0}、{1}、{2}中,當(dāng)用戶點(diǎn)擊超鏈接字段時(shí),程序就會(huì)導(dǎo)向ProductDetails.aspx? ProductName……網(wǎng)址(見(jiàn)圖9-32)。
? 創(chuàng)建顯示產(chǎn)品明細(xì)的DetailsView網(wǎng)頁(yè)
請(qǐng)創(chuàng)建顯示產(chǎn)品明細(xì)的ProductDetails.aspx網(wǎng)頁(yè),添加一個(gè)DetailsView與SqlDataSource控件,并將DetailsView的ID屬性設(shè)為“dview Product”,SqlDataSource控件的ID屬性設(shè)為“sqldsNorthwind”,將DetailsView的數(shù)據(jù)源指定到SqlDataSource控件(見(jiàn)圖9-33)。
圖9-32 ?HyperLinkField超鏈接字段設(shè)置完成界面
圖9-33 ?創(chuàng)建DetailsView及SqlDataSource控件
? 設(shè)置SqlDataSource的命令和參數(shù)
這個(gè)步驟可謂是本范例的重點(diǎn)步驟,通過(guò)SqlDataSource的命令和參數(shù)編輯器可以完全免程序代碼就完成數(shù)據(jù)明細(xì)的顯示,較之以前還必須花費(fèi)一些程序代碼而言,真的是既方便又容易,且參數(shù)也不容易出錯(cuò)。請(qǐng)點(diǎn)擊SqlDataSource控件的SelectQuery屬性以調(diào)用【命令和參數(shù)編輯器】(見(jiàn)圖9-34),設(shè)置步驟如下。
(1)請(qǐng)?jiān)赟elect命令窗口輸入SQL命令語(yǔ)句:“select * from Products where ProductName= @paramProductName and CategoryID= @paramCategoryID and? SupplierID= @paramSupplierID”。
(2)接著請(qǐng)加入三個(gè)參數(shù):
l? paramProductName參數(shù),其參數(shù)來(lái)源為“QueryString”,Query StringField為“ProductName”。
圖9-34 ?SqlDataSource的命令和參數(shù)編輯器
l? paramCategoryID參數(shù),其參數(shù)來(lái)源為“QueryString”,Query StringField為“CategoryID”。
l? paramSupplierID參數(shù),其參數(shù)來(lái)源為“QueryString”,Query StringField為“SupplierID”。
完成后請(qǐng)運(yùn)行HyperLinkField.aspx程序,界面如圖9-35所示。
圖9-35 ?HyperLinkField超鏈接字段運(yùn)行界面
?提醒
各位可以回頭看看在處理數(shù)據(jù)部分幾乎不需要寫(xiě)任何程序代碼。這在以前ASP.NET 1.0中是做不到的。向?qū)Ш糜脷w好用,但祭司希望您進(jìn)化到動(dòng)態(tài)程序代碼建構(gòu)。學(xué)會(huì)了動(dòng)態(tài)程序代碼建構(gòu),本章您才算結(jié)業(yè),若學(xué)會(huì)向?qū)гO(shè)置只能說(shuō)學(xué)會(huì)了一半,下一章會(huì)更深入解釋。
?范例9-12? 使用HyperLinkField超鏈接字段(動(dòng)態(tài)程序代碼)
本范例和前范例幾乎是一模一樣的,請(qǐng)參考HyperLinkFieldCode.aspx與ProductDetailsCode. aspx這兩支程序,唯一差別是在ProductDetailsCode.aspx程序中用CodeBehind動(dòng)態(tài)創(chuàng)建的,之所以在前一個(gè)范例介紹免程序的向?qū)Щ僮饔衷俳榻B使用程序動(dòng)態(tài)創(chuàng)建,是因?yàn)樽罱K希望各位能夠進(jìn)化到具有動(dòng)態(tài)程序建構(gòu)的能力,由于許多復(fù)雜的場(chǎng)景只有用動(dòng)態(tài)程序才辦得到,若只會(huì)向?qū)Р僮饔袝r(shí)會(huì)落得一籌莫展的下場(chǎng),所以祭司會(huì)先教向?qū)Чぞ咴俳瘫容^有水準(zhǔn)的動(dòng)態(tài)程序代碼,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)?jiān)贖yperLinkFieldCode.aspx中創(chuàng)建GridView及SqlDataSource控件,本步驟請(qǐng)參考前一范例STEP 1。
? 添加HyperLinkField超鏈接字段
請(qǐng)?jiān)贖yperLinkFieldCode.aspx中添加HyperLinkField超鏈接字段,本步驟請(qǐng)參考前一范例STEP 2。HyperLinkField超鏈接字段中只有DataNavigate-UrlFormatString的屬性不同:
ProductDetailsCode.aspx?ProductName={0}&CategoryID={1}&SupplierID={2}
? 創(chuàng)建顯示產(chǎn)品明細(xì)DetailsView網(wǎng)頁(yè)
請(qǐng)創(chuàng)建顯示產(chǎn)品明細(xì)ProductDetailsCode.aspx網(wǎng)頁(yè),加入一個(gè)DetailsView與SqlDataSource控件,并將DetailsView的ID屬性設(shè)為“dviewProduct”,SqlDataSource控件的ID屬性設(shè)為“sqldsNorthwind”。注意不要將DetailsView的DataSourceID屬性指定到SqlDataSource控件,因?yàn)橄乱徊襟E要展現(xiàn)CodeBehind技巧。
? 添加CodeBehind程序
在此要開(kāi)始陸續(xù)展現(xiàn)SqlDataSource控件的CodeBehind程序技巧,讓各位了解ASP.NET 2.0與1.0在數(shù)據(jù)訪問(wèn)方面的程序差異。只有通過(guò)CodeBehind程序技巧才能完全掌握SqlDataSource撰寫(xiě)的靈活度與強(qiáng)大功能。請(qǐng)?jiān)赑roductDetailsCode.aspx的Page_Load中添加下列程序代碼:
01? Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) ??Handles Me.Load
02? ??? If (Not IsPostBack) Then
03? ??????? '讀取來(lái)源URL
04? ??????? Session("sourceUrl") = Context.Request.UrlReferrer
05? ??? End If
06? ??? sqldsNorthwind.ConnectionString = WebConfigurationManager.
??????????? ConnectionStrings("NorthwindConnectionString").ConnectionString
07? ??? sqldsNorthwind.SelectCommand = "select * from Products where ??? ?
??????????? ProductName=@paramProductName and CategoryID=@paramCategoryID and
??????????? SupplierID=@paramSupplierID"
08?
09? ??? '創(chuàng)建參數(shù)
10? ??? '較為正式一一聲明語(yǔ)法
11? ??? 'Dim productParameter As New QueryStringParameter()
12? ??? 'productParameter.Name = "paramProductName"
13? ??? 'productParameter.Type = TypeCode.String
14? ??? 'productParameter.DefaultValue = Request.QueryString("ProductName")
15? ??? '簡(jiǎn)潔寫(xiě)法,其同等于上面?zhèn)€別一一聲明語(yǔ)法
16? ??? Dim productParameter As New QueryStringParameter("paramProductName",
?????????? TypeCode.String, "ProductName")
17? ??? sqldsNorthwind.SelectParameters.Add(productParameter)
18? ??? Dim categoryidParameter As New QueryStringParameter("paramCategoryID", ??
?????????? TypeCode.String, "CategoryID")
19? ??? sqldsNorthwind.SelectParameters.Add(categoryidParameter)
20? ??? Dim supplieridParameter As New QueryStringParameter("paramSupplierID", ??
?????????? TypeCode.String, "SupplierID")
21? ??? sqldsNorthwind.SelectParameters.Add(supplieridParameter)
22?
23? ??? dviewProduct.DataSourceID = sqldsNorthwind.ID
24? End Sub
程序說(shuō)明:
SqlParameter在Data Source控件上的應(yīng)用已有些改變,和以前1.0時(shí)的聲明方式有所不同,并且ASP.NET 2.0在參數(shù)方面因應(yīng)用情況的不同細(xì)分了六類參數(shù):ControlParameter、CookieParameter、FormParameter、QueryStringParameter、SessionParameter、ProfileParameter,而像網(wǎng)頁(yè)之間的參數(shù)傳遞剛好就必須使用QueryStringParameter這個(gè)類來(lái)創(chuàng)建,在第10章會(huì)有完整而清楚的介紹。
9.8.7 ?ImageField圖像字段
顧名思義,ImageField圖像字段是用來(lái)顯示圖片的,原理是指定圖片的Url網(wǎng)址給ImageField的DataImageUrlField屬性。基本上ImageField這功能有點(diǎn)聊勝于無(wú)的感覺(jué),為何這樣講呢?說(shuō)到這,祭司也覺(jué)得ImageField很不爭(zhēng)氣,弄一個(gè)這么小兒科的功能搪塞大家,即使GridView不提供ImageField字段,通過(guò)自定義方式大家也都能做到一樣的功能。而且許多人期盼的是ImageField要能顯示SQL Server數(shù)據(jù)庫(kù)的Image(或Binary)二進(jìn)制圖片,這樣便能夠省掉大家不少苦工與力氣,但偏偏I(xiàn)mageField就只能給定Url網(wǎng)址來(lái)顯示圖片。之所以會(huì)造成這種現(xiàn)象是因?yàn)樵驹贏SP.NET 2.0 Beta1中有個(gè)DynamicImage動(dòng)態(tài)圖像控件,能夠顯示動(dòng)態(tài)產(chǎn)生的圖片(如GDI+繪圖),但到了Beta 2時(shí)卻由于微軟產(chǎn)品進(jìn)度落后,而且刪除了不少功能,以致DynamicImage硬生生地被拿掉了,造成ImageField字段提供如此蹩腳的功能,讓人覺(jué)得實(shí)為可惜!OK,回歸正題,以下說(shuō)明該如何使用ImageField字段。
l? ImageField圖像字段重要屬性
前面已介紹過(guò)的字段屬性不再贅述,表9-15為ImageField超鏈接字段的重要屬性。
表9-15 ?ImageField圖像字段重要屬性表
| 屬? 性 | 說(shuō)? 明 |
| DataAlternateTextField | 設(shè)置綁定至ImageField對(duì)象AlternateText屬性的數(shù)據(jù)源字段名稱 |
| DataAlternateTextFormatString | 將DataAlternateTextField的字符串格式化 |
| DataImageUrlField | 設(shè)置綁定至ImageField對(duì)象ImageUrl屬性的數(shù)據(jù)源字段名稱 |
| DataImageUrlFormatString | 將DataImageUrlField的Url格式化 |
| NullImageUrl | 當(dāng)DataImageUrlField屬性值為null時(shí),則以NullImageUrl屬性的默認(rèn)圖片來(lái)替代 |
?范例9-13 ?使用ImageField圖像字段
Northwind數(shù)據(jù)庫(kù)的Employees員工數(shù)據(jù)表,里面有員工姓名、Photo(以二進(jìn)制方式儲(chǔ)存在SQL Server的圖片)、PhotoPath(照片Url網(wǎng)址),故以Employees數(shù)據(jù)表來(lái)示范。但由于ImageField圖像字段只能顯示Url的圖片,故將以PhotoPath為照片來(lái)源,而非Photo。請(qǐng)參考ImageField.aspx程序,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)創(chuàng)建GridView及SqlDataSource控件,并將GridView的ID屬性命名為“gviewEmployees”,SqlDataSource數(shù)據(jù)源請(qǐng)指定北風(fēng)數(shù)據(jù)庫(kù)的Employees數(shù)據(jù)表中的EmployeeID、LastName及PhotoUrl三個(gè)數(shù)據(jù)字段,最后再指定GridView的數(shù)據(jù)源為SqlDataSource控件(見(jiàn)圖9-36)。
圖9-36 ?創(chuàng)建GridView及SqlDataSource控件
? 修改PhotoPath的Url網(wǎng)址數(shù)據(jù)
雖然Employees數(shù)據(jù)表的PhotoPath字段中儲(chǔ)存了照片的Url路徑,但是筆者發(fā)現(xiàn)Url路徑中網(wǎng)站的照片已不存在,所以只好在網(wǎng)絡(luò)上找一些有效圖片的Url網(wǎng)址填入替代(Copy & Paste),如圖9-37所示。
圖9-37? 修改PhotoPathUrl網(wǎng)址
注
在Images目錄下有ImageUrl.txt文件,文件里有完整的Url路徑,但您的計(jì)算機(jī)必須能連接英特網(wǎng)。
? 創(chuàng)建ImageField圖像字段
在圖9-37中PhotoPath顯示出來(lái)的是Url文字,并非顯示路徑中的照片,那是因?yàn)镻hotoPath被當(dāng)成一般BoundField字段了,所以進(jìn)入GridView的編輯數(shù)據(jù)列中將該字段刪除,再加入一個(gè)ImageField圖像字段,并指定ImageField字段的DataImageFieldUrlField屬性為“PhotoPath”,HeaderText為“員工照片”即可(見(jiàn)圖9-38)。
圖9-38? 添加ImageField圖像字段
其實(shí)到這里步驟已算完成了,但以下兩個(gè)步驟還可以多設(shè)置一些屬性。
注
ImageField圖像字段在編輯時(shí)會(huì)顯示Url數(shù)據(jù)以供修改,若您不想讓員工照片Url被變更,只要將ReadOnly屬性設(shè)置為True即可。
? 調(diào)整ImageField圖片大小
若您覺(jué)得原始圖片太大,會(huì)占掉整個(gè)頁(yè)面,您可以調(diào)整ImageField字段的ControlStyle下的Height及Width屬性為“100px”,圖片還真的會(huì)縮小呢!這是祭司測(cè)試時(shí)碰巧發(fā)現(xiàn)的。
? 設(shè)置圖片的替代文字
在此還可以設(shè)置每張圖片的替代文字,請(qǐng)?jiān)O(shè)置ImageField字段的DataAlternateTextField屬性為“LastName”,DataAlternateTextFormatString為“這是{0}的照片”,當(dāng)鼠標(biāo)移至照片上方時(shí)即會(huì)顯示替代說(shuō)明文字(見(jiàn)圖9-39和圖9-40)。
??
??????? 圖9-39? ImageField圖像字段運(yùn)行界面??? ??圖9-40? ImageField字段縮小界面
9.8.8? TemplateField模板字段
TemplateField模板字段用來(lái)顯示用戶自定義的模板內(nèi)容。那什么時(shí)候會(huì)用到TemplateField?當(dāng)GridView所預(yù)定的幾種字段都無(wú)法滿足您的需求時(shí)就是使用TemplateField的時(shí)機(jī)了,而且TemplateField可以放入各種您所需要的控件。
l? TemplateField模板字段的模板類型
接著再來(lái)討論TemplateField模板字段相關(guān)屬性,TemplateField模板字段中又包含了五種可編輯部分,如表9-16所示。
表9-16? TemplateField模板字段類型
| 模板類型 | 說(shuō)? 明 |
| ItemTemplate | 字段項(xiàng)目模板 |
| AlternatingItemTemplate | 字段交替項(xiàng)目模板,若設(shè)置這個(gè)字段后,奇數(shù)行會(huì)顯示ItemTemplate,偶數(shù)行顯示AlternatingItemTemplate |
| EditItemTemplate | 編輯項(xiàng)目模板 |
| HeaderTemplate | 表頭模板 |
| FooterTemplate | 表尾模板 |
TemplateField模板字段語(yǔ)法如下:
<asp:GridView ID=”GridView1” runat=”server” DataSourceID=”SqlDataSource1”>
??? <Columns>
??????? <asp:TemplateField>
??????????? <ItemTemplate>
??????????????? <asp:控件> ... </asp>
??????????? </ItemTemplate>
??????????? <EditItemTemplate>
??????????????? <asp:控件> ... </asp>
??????????? </EditItemTemplate>
??????????? <HeaderTemplate>
??????????????? <asp:控件> ... </asp>
??????????? </HeaderTemplate>
??????????? <AlternatingItemTemplate>
??????????????? <asp:控件> ... </asp>
??????????? </AlternatingItemTemplate>
??????????? <FooterTemplate>
?????????? ?????<asp:控件> ... </asp>
??????????? </FooterTemplate>
??????? </asp:TemplateField>
??? </Columns>
</asp:GridView>
?范例9-14 ?GridView動(dòng)態(tài)顯示數(shù)據(jù)庫(kù)圖片
在上一個(gè)范例中,無(wú)法真正顯示數(shù)據(jù)庫(kù)中二進(jìn)制的Image圖片,那是因?yàn)镈ynamicImage控件被拿掉了,但各位可別這么認(rèn)命,還是有方法可以動(dòng)態(tài)讀取SQL Server數(shù)據(jù)庫(kù)中的二進(jìn)制Image圖片的,請(qǐng)參考Image FieldFromDB.aspx程序,步驟大致上與上一個(gè)范例相同,只有兩個(gè)地方不一樣:一是必須準(zhǔn)備一個(gè)圖像處理的Handler,另一個(gè)是在TemplateField字段中以HTML的 <Img> 來(lái)取代ImageField字段,說(shuō)明如下。
? 設(shè)置SqlDataSource數(shù)據(jù)源
請(qǐng)?jiān)O(shè)置SqlDataSource數(shù)據(jù)源為Employees數(shù)據(jù)表的EmployeeID、LastName與Photo三個(gè)字段。
? ImageHandler.ashx泛型處理方法
請(qǐng)?jiān)陧?xiàng)目中加入一個(gè)ImageHandler.ashx泛型處理方法,完整程序代碼如下:
01? <%@ WebHandler Language="VB" Class="ImageHandler" %>
02?
03? Imports System
04? Imports System.Web
05?
06? Public Class ImageHandler : Implements IHttpHandler
07? ??? '獲取數(shù)據(jù)庫(kù)連接設(shè)置
08? ? ??Shared connString As ConnectionStringSettings =
??????? ??WebConfigurationManager.ConnectionStrings("NorthwindConnectionString")
09? ???
10? ??? Public Sub ProcessRequest(ByVal context As HttpContext) ???? ?
?????????? Implements IHttpHandler.ProcessRequest
11? ??????? 'context.Response.ContentType = "text/plain"
12? ??????? 'context.Response.Write("Hello World")
13? ??????? Dim ms As MemoryStream = Nothing
14? ??????? Try
15? ??????????? '獲取員工代號(hào)
16? ??????????? Dim EmployeeID As String = ???
??????????????????? context.Request.QueryString("EmployeeID")
17? ??????????? '通過(guò)ReadImage類的GetImage()方法獲取SQL Server中圖片數(shù)據(jù)
18? ??????????? '創(chuàng)建Sql命令
19? ??????????? Dim strSQL As String = "Select Photo from Employees where
??????????????????? EmployeeID=@paramEmployeeID"
20? ??????????? '創(chuàng)建SqlDataSource
21? ??????????? Dim sqldsPhoto As New
?????????????????? SqlDataSource(connString.ConnectionString, strSQL)
22? ??????????? sqldsPhoto.SelectParameters.Add("paramEmployeeID", ??
?????????????????? TypeCode.Int32, EmployeeID)
23? ??????????? '通過(guò)SqlDataSource進(jìn)行查詢
24? ??????????? Dim dv As DataView = CType
?????????????????? (sqldsPhoto.Select(DataSourceSelectArguments.Empty), DataView)
25? ??????????? '返回DataView第一個(gè)Row的Photo字段數(shù)據(jù)
26? ??????????? Dim PhotoImage As Byte() = CType(dv(0)("Photo"), Byte())
27? ??????????? ms = New MemoryStream(PhotoImage, 0, PhotoImage.Length)
28? ??????? Catch ex As Exception
29?
30? ??????? End Try
31? ???????
32? ??????? If (ms IsNot Nothing) Then
33? ??????????? '獲取圖像MemoryStream大小
34? ??????????? Dim bufferSize As Integer = CType(ms.Length, Integer)
35? ??????????? '創(chuàng)建 buffer
36? ??????????? Dim buffer As Byte() = New Byte(bufferSize) {}
37? ??????????? '調(diào)用MemoryStream.Read,自MemoryStream 讀取至buffer,
38?????????? '并傳回count
39? ??????????? Dim countSize As Integer = ms.Read(buffer, 0, bufferSize)
40? ??????????? '返回圖像buffer
41? ??????????? context.Response.OutputStream.Write(buffer, 0, countSize)
42? ??????? End If
43? ??? End Sub
44?
45? ??? Public ReadOnly Property IsReusable() As Boolean?
?????????? Implements IHttpHandler.IsReusable
46? ??????? Get
47? ??????????? Return False
48? ??????? End Get
49? ??? End Property
50?
51? End Class
程序說(shuō)明:
以上的程序從連接字符串的讀取,到SqlDataSource動(dòng)態(tài)程序構(gòu)建,以及DataView數(shù)據(jù)類型的返回皆是正宗ASP.NET 2.0百分之百純正語(yǔ)法。不過(guò)您也可以使用傳統(tǒng)的ADO.NET語(yǔ)法來(lái)構(gòu)建,而祭司之所以使用SqlData Source語(yǔ)法構(gòu)建,純粹是為了展示新一代SqlDataSource語(yǔ)法要如何使用罷了,無(wú)好壞之分。程序說(shuō)明在批注中已講得很清楚了,各位看得懂看不懂都不要緊,以后在各位項(xiàng)目中直接Copy引用就行了。
? 創(chuàng)建TemplateField模板字段
請(qǐng)點(diǎn)擊GridView智能標(biāo)簽的【編輯列】進(jìn)入編輯模式,添加一個(gè)TemplateField模板字段以便容納HTML <Img> 控件,并將HeaderText命名為“員工照片”。所以目前共有兩個(gè)EmployeeID、LastName的BoundField字段,和一個(gè)TemplateField模板字段。
? 以HTML <Img>讀取ImageHandler.ashx泛型處理方法圖片
然而,ImageHandler.ashx雖強(qiáng),但如同千里馬必須有人主動(dòng)駕馭才有用,而網(wǎng)頁(yè)必須通過(guò)HTML <Img> 來(lái)調(diào)用ImageHandler.ashx,而ImageHandler.ashx接收到其傳來(lái)的工號(hào)后,以此工號(hào)讀取數(shù)據(jù)庫(kù)二進(jìn)制圖片,在一番處理后則輸出到OutputStream數(shù)據(jù)流中由 <Img> 顯示。故我們要在TemplateField模板字段中添加一個(gè)HTML的 <Img> 控件,請(qǐng)點(diǎn)擊GridView的【編輯模板】,選擇Column[2]-員工照片的ItemTemplate項(xiàng)目,接著再?gòu)墓ぞ呦渲型弦芬粋€(gè)HTML的Image控件到ItemTemplate中(見(jiàn)圖9-41),最后設(shè)置Image的Src屬性為下列關(guān)鍵程序:
ImageHandler.ashx?EmployeeID=<%# Eval(“EmployeeID”) %>
圖9-41 ?在Template模板中創(chuàng)建 <Img> Image控件
完成后請(qǐng)運(yùn)行程序,界面如圖9-42所示。
圖9-42 ?GridView動(dòng)態(tài)顯示數(shù)據(jù)庫(kù)圖片運(yùn)行界面
注
(1)Employees數(shù)據(jù)表中的Photo字段原本有78 bytes的位移,但因?yàn)檫@部分在某些地方會(huì)造成困擾,故祭司將照片數(shù)據(jù)重新設(shè)置過(guò),從0 byte開(kāi)始而不需要位移。在此建議您使用光盤(pán)所附的Northwind.mdf北風(fēng)數(shù)據(jù)庫(kù)較方便。
(2)請(qǐng)注意 <Img> 控件是HTML的,請(qǐng)勿誤用到ASP.NET的Image控件。
?范例9-15 ?創(chuàng)建TemplateField模板字段
由于TemplateField功能與向?qū)鄬?duì)于其他類型字段要復(fù)雜得多,故在此先實(shí)現(xiàn)一個(gè)范例,各位有了初步Sense后再來(lái)討論其相關(guān)屬性或議題會(huì)比較容易。請(qǐng)參考TemplateField.aspx程序,步驟說(shuō)明如下。
? 創(chuàng)建GridView及SqlDataSource控件
請(qǐng)拖曳一個(gè)GridView及SqlDataSource控件到設(shè)計(jì)界面,設(shè)置SqlDataSource數(shù)據(jù)庫(kù)連接及選擇ProductID、ProductName、UnitPrice三個(gè)字段,最后指定GridView的Data Source數(shù)據(jù)源為SqlDataSource控件。但因?yàn)橄到y(tǒng)會(huì)自動(dòng)將這三個(gè)數(shù)據(jù)字段顯示為BoundField數(shù)據(jù)綁定字段,而不是我們要的,故請(qǐng)點(diǎn)擊GridView的智能標(biāo)簽中的【編輯列】將這三個(gè)BoundField字段刪除,但先別關(guān)閉字段編輯器,下一步驟仍繼續(xù)使用它(見(jiàn)圖9-43)。
圖9-43 ?刪除BoundField字段
? 添加TemplateField模板字段
接著請(qǐng)?zhí)砑尤齻€(gè)TemplateField模板字段,并依序?qū)⑵銱eaderText改為“ProductID、ProductName、UnitPrice”,其模板顯示名稱也會(huì)自動(dòng)被修改,但是有個(gè)比較不一樣的地方是在字段編輯器中并無(wú)法設(shè)置TemplateField模板字段的數(shù)據(jù)源,完成后的GridView內(nèi)容是一片空白,必須到智能標(biāo)簽中【編輯模板】編輯其模板項(xiàng)目才能進(jìn)一步設(shè)置數(shù)據(jù)源(見(jiàn)圖9-44和圖9-45)。
?????? 圖9-44? 添加TemplateField屬性????????????? 圖9-45? 修改HeaderText屬性
? 編輯TemplateField模板
請(qǐng)點(diǎn)擊GridView智能標(biāo)簽中【編輯模板】編輯其模板內(nèi)容,進(jìn)去后請(qǐng)點(diǎn)擊模板編輯智能標(biāo)簽中【顯示】菜單,編輯上一步驟所添加的三個(gè)模板:
(1)選擇Column[0]-ProductID模板的ItemTemplate→添加Literal控件,并點(diǎn)擊Literal控件智能標(biāo)簽的【編輯DataBindings】,點(diǎn)擊Text屬性的綁定數(shù)據(jù)字段為“ProductID”(見(jiàn)圖9-46)。
圖9-46? 編輯ItemTemplateDataBindings數(shù)據(jù)源字段
(2)選擇Column[1]-ProductName模板的ItemTemplate→添加Button控件,并點(diǎn)擊Button控件智能標(biāo)簽的【編輯DataBindings】,點(diǎn)擊Text屬性的綁定數(shù)據(jù)字段為“ProductName”。
(3)選擇Column[2]-UnitPrice模板的ItemTemplate→添加TextBox控件,并點(diǎn)擊TextBox控件智能標(biāo)簽的【編輯DataBindings】,點(diǎn)擊Text屬性的綁定數(shù)據(jù)字段為“UnitPrice”,完成后請(qǐng)結(jié)束模板編輯,并按【F5】運(yùn)行網(wǎng)頁(yè)(見(jiàn)圖9-47)。
圖9-47 ?TemplateField模板字段運(yùn)行界面
編輯完成后的HTML語(yǔ)法如下:
<asp:GridView ID=”gviewProduct” runat=”server” AutoGenerateColumns=”False” CellPadding=”4”
??? <Columns>
??????? <asp:TemplateField HeaderText=”P(pán)roductID”>
??????????? <ItemTemplate>
??????????????? <asp:Literal ID=”Literal1” runat=”server” Text=’<%# Eval
????? ??????????(“ProductID”) %>’></asp:Literal>
??????????? </ItemTemplate>
??????? </asp:TemplateField>
??????? <asp:TemplateField HeaderText=”P(pán)roductName”>
??????????? <ItemTemplate>
??????????????? <asp:Button ID=”Button1” runat=”server” Text=’<%# Eval
???? ???????????(“ProductName”) %>’ />
??????????? </ItemTemplate>
??????? </asp:TemplateField>
??????? <asp:TemplateField HeaderText=”UnitPrice”>
??????????? <ItemTemplate>
??????????????? <asp:TextBox ID=”TextBox1” runat=”server” Text=’<%# Bind
????????????? ??(“UnitPrice”) %>’></asp:TextBox>
??????????? </ItemTemplate>
??????? </asp:TemplateField>
...
</asp:GridView>
程序說(shuō)明:
在以上的HTML程序中,有兩個(gè)特殊字眼Eval與Bind,它們的作用是數(shù)據(jù)字段的綁定。Eval是單向只讀,而B(niǎo)ind則是雙向可更新,詳細(xì)說(shuō)明請(qǐng)看下一節(jié)。
9.8.9? 數(shù)據(jù)綁定Eval方法vs. Bind方法
ASP.NET 2.0的Data-Binding數(shù)據(jù)綁定語(yǔ)法表示符為“<% #? %>”,而里面必須搭配Eval或Bind指令,也就是 <% ?# ?Eval(“ProductID”) ?%> 或 <% ?# ?Bind(“ProductID”) ?%>,”P(pán)roductID” 則為數(shù)據(jù)源字段。Eval和Bind兩種方法是有差異的,以下是說(shuō)明。
l? Eval:用于單向數(shù)據(jù)綁定,數(shù)據(jù)是只讀顯示。
l? Bind:Bind則是雙向的數(shù)據(jù)綁定,不但能讀取數(shù)據(jù),更具有Insert、Update、Delete功能,所以若您需要編輯更新、添加與刪除功能必須使用本方法。
相對(duì)于ASP.NET 1.0舊語(yǔ)法DataBinder.Eval(Container.DataItem, “fieldname”)而言,筆者建議您在GridView、DetailsView及FormView之間應(yīng)優(yōu)先使用新的聲明語(yǔ)法。以上范例只是示范如何使用TemplateField模板字段,真實(shí)企業(yè)網(wǎng)站構(gòu)建的模板通常不會(huì)這么簡(jiǎn)單,但加入更復(fù)雜的自定義模板控件過(guò)程則是差不多的。
9.8.10 ?將Field字段轉(zhuǎn)換成模板
上面共介紹七種字段類型,包括:BoundField、ButtonField、Command Field、CheckBoxField、HyperLinkField、Image Field與TemplateField,然而除了TemplateField以外,前面六種字段都可以再轉(zhuǎn)換成為TemplateField模板字段,而這有什么用呢?讓我們來(lái)看看實(shí)際范例說(shuō)明。
?范例9-16 ?將Field字段轉(zhuǎn)換成模板
其實(shí)將Field字段轉(zhuǎn)換成模板只有一個(gè)重要步驟,沒(méi)什么值得大書(shū)特書(shū),但因?yàn)榧浪具€想教各位如何在VS 2005 中復(fù)制窗體的注意事項(xiàng),并修正其相關(guān)設(shè)置,才特別列舉這個(gè)范例。步驟說(shuō)明如下。
? 復(fù)制Web Form窗體
請(qǐng)?jiān)贑heckBoxField.aspx窗體中點(diǎn)擊鼠標(biāo)右鍵選擇【復(fù)制】,接著點(diǎn)擊網(wǎng)站項(xiàng)目的最上層節(jié)點(diǎn),再點(diǎn)擊鼠標(biāo)右鍵選擇【粘貼】,這時(shí)會(huì)產(chǎn)生一個(gè)復(fù)制的窗體“復(fù)件CheckBoxField.aspx”,請(qǐng)?jiān)凇皬?fù)件CheckBoxField.aspx”窗體中按鼠標(biāo)右鍵選擇【重命名】,將名稱改為“CheckBoxFieldTemplate.aspx”。雖然它可以正確運(yùn)行,但仍有可能會(huì)和CheckBoxField.aspx原始窗體互相干擾,為什么?因?yàn)閮烧叩腜artial Class名稱皆為“CheckBoxField”類,而在第2章就曾提到編譯器會(huì)視Partial Class CheckBoxField為一體,故在系統(tǒng)中會(huì)有連動(dòng)干擾的可能性,若想徹底分開(kāi)必須做若干修正。
? 修改相關(guān)設(shè)置
復(fù)制后的窗體要修正的地方有三點(diǎn):
(1)必須將HTML中的CodeFile=”CheckBoxField.aspx.vb” 改成CodeFile=”CheckBox- FieldTemplate.aspx.vb”。
(2)必須將HTML中的Inherits=”CheckBoxField”改成Inherits=”CheckBoxFieldTemplate”。
(3)必須將CodeBehind中的類聲明由“Partial Class CheckBoxField”改成“Partial Class CheckBoxFieldTemplate”。
修改完上述三個(gè)地方后,復(fù)制的新窗體才算與原始的窗體脫離關(guān)系,也不會(huì)有互相干擾的情況。而窗體的復(fù)制在網(wǎng)頁(yè)開(kāi)發(fā)中也算常用到的功能,所以祭司要在此提醒各位如何做正確的修改。
? 將Field字段轉(zhuǎn)換成模板
接著請(qǐng)?jiān)凇揪庉嬃小恐悬c(diǎn)取字段后再選“將此字段轉(zhuǎn)換為TemplateField”,這樣就能將原來(lái)的如BoundField轉(zhuǎn)成TemplateField模板字段,完成后請(qǐng)結(jié)束字段編輯模式(見(jiàn)圖9-48)。
圖9-48 ?將Field字段轉(zhuǎn)換成模板
而轉(zhuǎn)換后好像也沒(méi)發(fā)現(xiàn)有什么不一樣?事實(shí)上轉(zhuǎn)換成模板后,您就可以進(jìn)行【編輯模板】功能,可以到里面再進(jìn)行修改或自定義。但我相信還是有許多人一時(shí)不理解這樣做到底有什么意義?請(qǐng)?jiān)倏聪乱徊襟E。
? 修改Template模板
以原本GridView的UnitPrice及UnitStock都用Label控件文字顯示,在此請(qǐng)進(jìn)入【編輯模板】里將其改為TextBox控件顯示,記得自行修改數(shù)據(jù)綁定Bind(“UnitPrice”)及Bind(“UnitStock”)。
? 加入編輯按鈕的Confirm確定事件對(duì)話框
請(qǐng)?jiān)凇揪庉嬆0濉恐袑⒕庉婤utton按鈕的OnClientClick屬性設(shè)置為“return confirm
('確定進(jìn)行資料編輯?')”即可(見(jiàn)圖9-49)。
圖9-49? 修改Template模板
其實(shí)轉(zhuǎn)換成模板的最大用意是,如果原先所設(shè)計(jì)的字段無(wú)法達(dá)到新需求的功能,則可直接將原來(lái)的字段類型轉(zhuǎn)為Template模板。一旦轉(zhuǎn)為Template模板后,祭司只能用四個(gè)字來(lái)形容:“為所欲為”。您可以在文字段中再加上圖片或者合并多個(gè)字段數(shù)據(jù),這就不是原先BoundField等字段類型所能達(dá)到的了!
總結(jié)
以上是生活随笔為你收集整理的Gridview数据控件的七种字段类型的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: asp.net中将数据库绑定到DataL
- 下一篇: 数据列表DataList模板之实例