第4章標(biāo)準(zhǔn)控件

第4章ASP.NET3.5標(biāo)準(zhǔn)控件1本章要點(diǎn)：理解ASP.NET3.5頁(yè)面事件處理流程了解HTML服務(wù)器控件熟悉ASP.NET3.5標(biāo)準(zhǔn)控件熟練掌握各個(gè)控件應(yīng)用實(shí)例2目錄4.1ASP.NET3.5頁(yè)面事件處理4.1.1ASP.NET3.5事件4.1.2屬性IsPostBack4.2ASP.NET3.5服務(wù)器控件概述4.2.1HTML服務(wù)器控件簡(jiǎn)介4.2.2Web服務(wù)器控件簡(jiǎn)介3目錄4.3標(biāo)準(zhǔn)控件4.3.1Label控件4.3.2TextBox控件4.3.3Button、LinkButton和ImageButton控件4.3.4DropDownList控件4.3.5ListBox控件4.3.6CheckBox和CheckBoxList控件4.3.7RadioButton和RadioButtonList控件4.3.8Image和ImageMap控件4目錄4.3.9HyperLink控件4.3.10Table控件4.3.11Panel和PlaceHolder控件4.3.12MultiView和View控件4.3.13Wizard控件4.4小結(jié)

54.1ASP.NET3.5頁(yè)面事件處理只有熟悉ASP.NET3.5頁(yè)面事件處理流程，才能理解代碼的執(zhí)行順序。64.1.1ASP.NET3.5事件常用頁(yè)面處理事件Page_PreInit：通過(guò)IsPostBack屬性確定是否第一次處理該頁(yè)、創(chuàng)建動(dòng)態(tài)控件、動(dòng)態(tài)設(shè)置主題屬性、讀取配置文件屬性等。Page_Init：初始化控件屬性。Page_Load：讀取和更新控件屬性?？丶录禾幚硖囟ㄊ录?，如Button控件的Click事件。事件處理的先后順序Page_PreInit、Page_Init、Page_Load和控件的事件74.1.1ASP.NET3.5事件（續(xù)）Click事件被觸發(fā)時(shí)會(huì)引起頁(yè)面往返處理。Change事件被觸發(fā)時(shí)，先將事件的信息暫時(shí)保存在客戶端的緩沖區(qū)中，等到下一次向服務(wù)器傳遞信息時(shí)，再和其他信息一起發(fā)送給服務(wù)器。若要讓控件的Change事件立即得到服務(wù)器的響應(yīng)，就需要將該控件的屬性AutoPostBack值設(shè)為true。84.1.2屬性IsPostBack當(dāng)控件的事件被觸發(fā)時(shí)，Page_Load事件會(huì)在控件的事件之前被觸發(fā)。如果想在執(zhí)行控件的事件代碼時(shí)不執(zhí)行Page_Load事件中的代碼，可以通過(guò)判斷屬性Page.IsPostBack實(shí)現(xiàn)。屬性IsPostBack在用戶第一次瀏覽網(wǎng)頁(yè)時(shí)，會(huì)返回值false，否則返回值true。9實(shí)例4-1屬性IsPostBack應(yīng)用本實(shí)例在頁(yè)面第一次載入時(shí)顯示“頁(yè)面第一次加載！”。當(dāng)單擊按鈕時(shí)顯示“執(zhí)行Click事件代碼！”信息。源程序：IsPostBack.aspx程序說(shuō)明：當(dāng)單擊按鈕時(shí)引起頁(yè)面往返，此時(shí)首先處理Page_Load事件中代碼，但因?yàn)椤?！IsPostBack”值為false，所以不執(zhí)行“Response.Write(“頁(yè)面第一次加載！”)”，然后處理Click事件中代碼，顯示“執(zhí)行Click事件代碼！”信息。104.2ASP.NET3.5服務(wù)器控件概述HTML服務(wù)器控件：常用于升級(jí)原有的ASP頁(yè)面到ASP.NET頁(yè)面。Web服務(wù)器控件：目前的ASP.NET3.5網(wǎng)站建設(shè)中，優(yōu)先考慮Web服務(wù)器控件。當(dāng)Web服務(wù)器控件無(wú)法完成特定的任務(wù)時(shí)，可考慮HTML服務(wù)器控件。114.2.1HTML服務(wù)器控件簡(jiǎn)介實(shí)現(xiàn)了將XHTML元素到服務(wù)器控件的轉(zhuǎn)換。經(jīng)過(guò)轉(zhuǎn)換后，Web窗體頁(yè)就可訪問(wèn)XHTML元素（HTML服務(wù)器控件），從而實(shí)現(xiàn)在服務(wù)器端對(duì)HTML服務(wù)器控件的編程。添加屬性“runat="server"”將轉(zhuǎn)換XHTML元素到HTML服務(wù)器控件。 <inputid="Button2"type="button"value="button"/> <inputid="Button2"type="button"value="button"runat="server"/>124.2.2Web服務(wù)器控件簡(jiǎn)介可以描述頁(yè)面元素的功能、外觀、操作方式和行為等。對(duì)于不同的瀏覽器，可能會(huì)得到不同的XHTML輸出。根據(jù)功能不同分成標(biāo)準(zhǔn)控件、數(shù)據(jù)控件、驗(yàn)證控件、導(dǎo)航控件、登錄控件、WebParts控件、AJAXExtensions控件和用戶自定義控件。

134.3標(biāo)準(zhǔn)控件屬性名說(shuō)明屬性名說(shuō)明AccessKey控件的鍵盤快捷鍵Font控件的字體屬性Attributes控件的所有屬性集合Height控件的高度BackColor控件的背景色I(xiàn)D控件的編程標(biāo)識(shí)符BoderWidth控件的邊框?qū)挾萒abIndex控件的索引順序BoderStyle控件的邊框樣式Text控件上顯示的文本CssClass控件的CSS類名ToolTip當(dāng)鼠標(biāo)懸停在控件上時(shí)顯示的文本CssStyle控件的樣式Visible控件是否在Web頁(yè)上顯示Enabled是否啟用Web服務(wù)器控件Width控件的寬度144.3.1Label控件用于在瀏覽器上顯示文本，可以在服務(wù)器端動(dòng)態(tài)地修改文本。通過(guò)Text屬性指定控件顯示的內(nèi)容。定義的語(yǔ)法格式如下： <asp:LabelID="Label1"runat="server"Text="Label"></asp:Label>很實(shí)用的屬性AssociatedControlID：值可把Label控件與窗體中另一個(gè)服務(wù)器控件關(guān)聯(lián)起來(lái)。15實(shí)例4-2通過(guò)鍵盤快捷鍵激活特定文本框當(dāng)按下ALT+N時(shí)，將激活用戶名右邊的文本框；當(dāng)按下ALT+P時(shí)將激活密碼右邊的文本框。源程序：Lable.aspx164.3.2TextBox控件用于顯示數(shù)據(jù)或輸入數(shù)據(jù)。語(yǔ)法格式如下：

<asp:TextBoxID="TextBox1"runat="server"></asp:TextBox>

17

TextBox控件常用屬性、方法和事件表TextMode屬性值“SingleLine”表示單行文本框；值“Password”表示密碼框，將顯示特殊字符，如“*”；值“MultiLine”表示多行文本框。AutoPostBack屬性值“true”表示當(dāng)文本框內(nèi)容改變且把焦點(diǎn)移出文本框時(shí)觸發(fā)TextChanged事件，引起頁(yè)面往返處理。AutoCompleteType屬性標(biāo)注能自動(dòng)完成的類型，如Email表示能自動(dòng)完成郵件列表。Focus()方法設(shè)置文本框焦點(diǎn)。TextChanged事件當(dāng)改變文本框中內(nèi)容且焦點(diǎn)離開文本框后觸發(fā)。18實(shí)例4-3控件TextBox綜合應(yīng)用當(dāng)頁(yè)面載入時(shí)，焦點(diǎn)自動(dòng)定位在用戶名右邊的文本框中；當(dāng)輸入用戶名并把焦點(diǎn)移出文本框時(shí)，將觸發(fā)TextChanged事件，判斷用戶名是否可用，若可用則在lblValidate中顯示“√”，否則顯示“用戶名已占用！”；密碼右邊的文本框顯示為密碼框；E-mail右邊的文本框具有自動(dòng)完成功能。源程序：TextBox.aspx

19程序說(shuō)明當(dāng)頁(yè)面載入時(shí)，觸發(fā)Page_Load事件，將焦點(diǎn)定位在用戶名右邊的文本框中。本示例中用戶合法性判斷是與固定用戶名“jxssg”比較，實(shí)際使用需連接數(shù)據(jù)庫(kù)，與數(shù)據(jù)庫(kù)中保存的用戶名比較。要看到自動(dòng)完成Email列表的效果，需先輸入E-mail并單擊確認(rèn)后再次輸入信息時(shí)才能看到效果。204.3.3Button、LinkButton和ImageButton控件

Button：傳統(tǒng)按鈕外觀。LinkButton：超鏈接外觀。ImageButton：圖形外觀，其圖像由ImageUrl屬性設(shè)置。 <asp:ButtonID="Button1"runat="server"Text="Button"/> <asp:LinkButtonID="LinkButton1"runat="server">LinkButton</asp:LinkButton> <asp:ImageButtonID="ImageButton1"runat="server"ImageUrl="~/pic/map.JPG"/>

21按鈕控件實(shí)用屬性和事件PostBackUrl屬性：?jiǎn)螕舭粹o時(shí)發(fā)送到的URL。Click事件：當(dāng)單擊按鈕時(shí)被觸發(fā)，執(zhí)行服務(wù)器端代碼。ClientClick事件：當(dāng)單擊按鈕時(shí)被觸發(fā)，執(zhí)行客戶端代碼。22比較<a>與LinkButton兩者都能呈現(xiàn)超鏈接形式設(shè)置具體的跳轉(zhuǎn)方法不同。在<a>元素中通過(guò)屬性href設(shè)置，如：

<ahref="">鏈接到21世紀(jì)</a>

而在LinkButton中需要設(shè)置PostBackUrl屬性或在Click事件中輸入代碼，通過(guò)Response對(duì)象的重定向方法Redirect()實(shí)現(xiàn)，如：

Response.Redirect("");23實(shí)例4-4利用Button控件執(zhí)行客戶端腳本要在單擊Button控件后執(zhí)行客戶端腳本，需要使用ClientClick事件和JavaScript。源程序：ClientClick.aspx程序說(shuō)明：當(dāng)單擊刪除按鈕時(shí)，觸發(fā)ClientClick事件，執(zhí)行JavaScript代碼“returnconfirm('確定要?jiǎng)h除記錄嗎?')”，彈出確認(rèn)對(duì)話框。若單擊“確定”按鈕，觸發(fā)Click事件，執(zhí)行刪除操作（這里僅輸出信息，實(shí)際操作需連接數(shù)據(jù)庫(kù)）；若單擊“取消”，將不再觸發(fā)Click事件，運(yùn)行結(jié)束。244.3.4DropDownList控件允許用戶從預(yù)定義的下拉列表中選擇一項(xiàng)。 <asp:DropDownListID="DropDownList1"runat="server"></asp:DropDownList>25DropDownList控件實(shí)用屬性和事件表DataSource屬性使用的數(shù)據(jù)源。DataTextField屬性對(duì)應(yīng)數(shù)據(jù)源中的一個(gè)字段，該字段所有內(nèi)容將被顯示于下拉列表中。DataValueField屬性數(shù)據(jù)源中的一個(gè)字段，指定下拉列表中每個(gè)可選項(xiàng)的值。Items屬性列表中所有選項(xiàng)的集合，經(jīng)常使用Items.Add()方法添加項(xiàng)，Clear()方法刪除所有項(xiàng)。SelectedItem屬性當(dāng)前選定項(xiàng)。SelectedValue屬性當(dāng)前選定項(xiàng)的屬性Value值。SelectedIndexChanged事件當(dāng)選擇下拉列表中一項(xiàng)后被觸發(fā)。DataBind()方法綁定數(shù)據(jù)源。26添加項(xiàng)到DropDownList中在屬性窗口中直接對(duì)屬性Items進(jìn)行設(shè)置利用DropDownList對(duì)象的Items.Add()方法添加項(xiàng)，如： DropDownList1.Items.Add(newListItem("浙江","zhejiang"));通過(guò)屬性DataSource設(shè)置數(shù)據(jù)源，再通過(guò)DataBind()方法顯示數(shù)據(jù)。27實(shí)例4-5實(shí)現(xiàn)聯(lián)動(dòng)的下拉列表聯(lián)動(dòng)的下拉列表在實(shí)際工程項(xiàng)目中非常普遍，如要查詢某班級(jí)的課表，需要“學(xué)年—學(xué)期—分院—班級(jí)”這樣聯(lián)動(dòng)的下拉列表。本實(shí)例以日期聯(lián)動(dòng)為例，在默認(rèn)情況下，顯示系統(tǒng)日期，當(dāng)改變年或月時(shí)，相應(yīng)的每月天數(shù)會(huì)隨之而變。28實(shí)例4-5實(shí)現(xiàn)聯(lián)動(dòng)的下拉列表（續(xù)）源程序：DropDownList.aspx程序說(shuō)明：瀏覽時(shí)首先觸發(fā)Page_Load事件，綁定年、月、日到三個(gè)DropDownList控件。當(dāng)改變年或月份時(shí)，觸發(fā)相應(yīng)控件的SelectedIndexChanged事件形成頁(yè)面往返，將相應(yīng)月份的天數(shù)綁定到ddlDay。294.3.5ListBox控件DropDownList和ListBox控件都允許用戶從列表中選擇項(xiàng)，區(qū)別在于DropDownList的列表在用戶選擇前處于隱藏狀態(tài)，而ListBox的選項(xiàng)列表是可見的，并且可同時(shí)選擇多項(xiàng)。<asp:ListBoxID="ListBox1"runat="server"></asp:ListBox>SelectionMode屬性：值為Multiple表示允許選擇多項(xiàng)。30實(shí)例4-6實(shí)現(xiàn)數(shù)據(jù)項(xiàng)在ListBox控件之間的移動(dòng)當(dāng)選擇左邊列表框中的項(xiàng)，再單擊按鈕后相應(yīng)的項(xiàng)將移動(dòng)到右邊的列表框。源程序：ListBox.aspx314.3.6CheckBox和CheckBoxList控件為用戶提供“真/假”、“是/否”或“開/關(guān)”選項(xiàng)之間進(jìn)行選擇的方法，若需要多項(xiàng)選擇，可以使用多個(gè)CheckBox或單個(gè)CheckBoxList，但一般采用CheckBoxList。<asp:CheckBoxID="CheckBox1"runat="server"/> <asp:CheckBoxListID="CheckBoxList1"runat="server"></asp:CheckBoxList>324.3.6CheckBox和CheckBoxList控件（續(xù)）注意：判斷CheckBox是否選中的屬性是Checked，而CheckBoxList作為集合控件，判斷列表項(xiàng)是否選中的屬性是成員的Selected屬性。在實(shí)際工程項(xiàng)目中，一般設(shè)置CheckBoxList的屬性AutoPostBack值為false。要提交數(shù)據(jù)到服務(wù)器，不采用CheckBoxList的自身事件，而是常配合Button控件實(shí)現(xiàn)。33實(shí)例4-7CheckBoxList應(yīng)用當(dāng)選擇個(gè)人愛好并單擊提交按鈕后顯示選中項(xiàng)的提示信息。源程序：CheckBoxList.aspx344.3.7RadioButton和RadioButtonList控件常用于在多種選擇中只能選擇一項(xiàng)的場(chǎng)合。單個(gè)的RadioButton只能提供單項(xiàng)選擇，可以將多個(gè)RadioButton形成一組，方法是設(shè)置每個(gè)RadioButton的屬性GroupName為同一名稱。<asp:RadioButtonID="RadioButton1"runat="server"GroupName="group"/> <asp:RadioButtonID="RadioButton2"runat="server"GroupName="group"/>354.3.7RadioButton和RadioButtonList控件<asp:RadioButtonListID="RadioButtonList1"runat="server"><asp:ListItem>男</asp:ListItem><asp:ListItem>女</asp:ListItem></asp:RadioButtonList>注意：判斷RadioButton是否選中使用Checked屬性，而獲取RadioButtonList的選中項(xiàng)使用屬性SelectedItem。364.3.8Image和ImageMap控件Image控件用于在Web窗體上顯示圖像，圖像源文件可以使用ImageUrl屬性在界面設(shè)計(jì)時(shí)確定，也可以在編程時(shí)指定。在工程實(shí)際項(xiàng)目中常與數(shù)據(jù)源綁定，根據(jù)數(shù)據(jù)源指定信息顯示圖像。<asp:ImageID="Image1"runat="server"ImageUrl="~/pic/map.JPG"/>注意：Image控件不包含Click事件，如果需要Click事件處理流程，可使用ImageButton控件代替Image控件。374.3.8Image和ImageMap控件（續(xù)）ImageMap控件除可以用來(lái)顯示圖像外，還可以實(shí)現(xiàn)圖像的超鏈接?？梢詫@示的圖像劃分為不同形狀的熱點(diǎn)區(qū)域，分別鏈接到不同的網(wǎng)頁(yè)。在工程實(shí)際項(xiàng)目中，常用于導(dǎo)航條、地圖等。熱點(diǎn)區(qū)域通過(guò)屬性HotSpot設(shè)置，劃分的區(qū)域有圓形CircleHotSpot、長(zhǎng)方形RectangleHotSpot和任意多邊形PolygonHotSpot，每個(gè)區(qū)域通過(guò)屬性NavigateUrl確定要鏈接到的URL。38實(shí)例4-8利用ImageMap設(shè)計(jì)導(dǎo)航條整個(gè)導(dǎo)航條是一張圖片，當(dāng)設(shè)置好熱點(diǎn)區(qū)域后，點(diǎn)擊不同區(qū)域?qū)㈡溄拥讲煌W(wǎng)頁(yè)。源程序：ImageMap.aspx394.3.9HyperLink控件用于在網(wǎng)頁(yè)上創(chuàng)建鏈接，與元素<a>不同，HyperLink控件可以與數(shù)據(jù)源綁定。<asp:HyperLinkID="HyperLink1"runat="server"Target="_blank">HyperLink</asp:HyperLink>屬性Target：值為框架名、_blank或_self。框架名決定了在指定的框架中顯示鏈接頁(yè)，_blank決定了在一個(gè)新窗口中顯示鏈接頁(yè)，而_self決定了在原窗口中顯示鏈接頁(yè)。404.3.9HyperLink控件注意：HyperLink控件不包含Click事件，要使用Click事件可用LinkButton控件代替。在同時(shí)設(shè)置屬性Text和ImageUrl的情況下，ImageUrl優(yōu)先。若找不到圖片則顯示屬性Text設(shè)置的內(nèi)容。在HyperLink中直接設(shè)置ImageUrl后顯示的圖形尺寸是不可調(diào)的，若要改變圖形尺寸，可配合使用Image控件。41實(shí)例4-9組合使用HyperLink和Image控件本實(shí)例呈現(xiàn)頁(yè)面中顯示圖片的尺寸與實(shí)際圖片的尺寸不相同。源程序：HyperLink.aspx424.3.10Table控件用于在Web窗體上動(dòng)態(tài)地創(chuàng)建表格，是一種容器控件。Table對(duì)象由行（TableRow）對(duì)象組成，TableRow對(duì)象由單元格（TableCell）對(duì)象組成。<asp:TableID="Table1"runat="server"GridLines="Both"><asp:TableRowrunat="server"><asp:TableCellrunat="server">學(xué)號(hào)</asp:TableCell><asp:TableCellrunat="server">姓名</asp:TableCell><asp:TableCellrunat="server">成績(jī)</asp:TableCell></asp:TableRow></asp:Table>434.3.10Table控件（續(xù)）注意：向Table添加行使用屬性Rows；向TableRow添加單元格使用屬性Cells；向TableCell添加控件使用屬性Controls。44實(shí)例4-10動(dòng)態(tài)生成表格本實(shí)例頁(yè)面上的簡(jiǎn)易成績(jī)錄入界面實(shí)質(zhì)是動(dòng)態(tài)生成的表格。源程序：Table.aspx454.3.11Panel和PlaceHolder控件都是Web窗體上的容器控件，常用于動(dòng)態(tài)地建立控件和不同情況下在同一個(gè)頁(yè)面上顯示不同內(nèi)容。相比較而言，Panel控件的屬性要豐富得多。Panel控件把包含在其中的控件組當(dāng)成一個(gè)整體看待，這樣可以統(tǒng)一設(shè)置屬性。 <asp:PanelID="Panel1"runat="server"></asp:Panel> <asp:PlaceHolderID="PlaceHolder1"runat="server"></asp:PlaceHolder>46實(shí)例4-11利用Panel實(shí)現(xiàn)簡(jiǎn)易注冊(cè)頁(yè)面源程序：Panel.aspx程序說(shuō)明：當(dāng)頁(yè)面載入時(shí)，首先執(zhí)行Page_Load事件代碼，將pnlStep1設(shè)置為可見，而將其它兩個(gè)Panel控件設(shè)置為不可見。判斷用戶名是否重復(fù)在實(shí)際工程項(xiàng)目中將與數(shù)據(jù)庫(kù)連接。信息也將保存到數(shù)據(jù)庫(kù)中。47實(shí)例4-12利用PlaceHolder動(dòng)態(tài)添加控件PlaceHolder控件在Web窗體上起到占位的作用，可向其中動(dòng)態(tài)地添加需要的控件。源程序：PlaceHolder.aspx程序說(shuō)明：頁(yè)面載入時(shí)，執(zhí)行Page_Load事件代碼，動(dòng)態(tài)生成一個(gè)Button控件和一個(gè)TextBox控件。當(dāng)單擊“確認(rèn)”按鈕時(shí)，根據(jù)注冊(cè)的事件執(zhí)行btnSubmit_Click()中代碼。48實(shí)例4-12利用PlaceHolder動(dòng)態(tài)添加控件注意：如果一個(gè)包含動(dòng)態(tài)生成控件的頁(yè)面有往返處理，那么動(dòng)態(tài)生成控件的代碼要放在Page_Load事件中，當(dāng)頁(yè)面往返時(shí)觸發(fā)Page_Load事件需要重復(fù)生成動(dòng)態(tài)控件；動(dòng)態(tài)生成的控件不能在設(shè)計(jì)時(shí)直接綁定事件代碼，需手工注冊(cè)；在獲取動(dòng)態(tài)生成控件中文本框等控件的輸入信息時(shí)，需要使用FindControl()方法先找到控件。494.3.12MultiView和View控件提供了一種多視圖切換顯示信息的方式，可以容易地實(shí)現(xiàn)分頁(yè)多步驟功能。在使用時(shí)，MultiView作為View的容器控件，View作為其它控件的容器控件。<asp:MultiViewID="MultiView1"runat="server"><asp:ViewID="View1"runat="server"></asp:View><asp:ViewID="View2"runat="server"></asp:View></asp:MultiView>ActiveViewIndex屬性：決定了當(dāng)前顯示哪個(gè)視圖，默認(rèn)值為-1，值0表示MultiView中包含的第一個(gè)View。50View中Button類型控件實(shí)用屬性表CommandNameCommandArgument說(shuō)明NextView不需要設(shè)置顯示下一個(gè)ViewPrevView不需要設(shè)置顯示上一個(gè)ViewSwitchViewByID要切換到的View控件ID切換到指定ID的ViewViewByIndex要切換到的View控件索引號(hào)切換到指定索引號(hào)的View51實(shí)例4-13利用MultiView和View實(shí)現(xiàn)用戶編程習(xí)慣調(diào)查源程序：MultiView.aspx524.3.13Wizard控件Wizard控件作為一種向?qū)Э丶?，主要用于搜集用戶信息、配置系統(tǒng)等。<asp:WizardID="Wizard1"runat="server"><WizardSteps><asp:WizardSteprunat="server"title="Step1"></asp:WizardStep><asp:WizardSteprunat=