WEB服務器控件

1、第二章：WEB服務器控件在ASP.NET中，Web Form能容納的對象主要是Server Control（服務器端控件）?？丶蟹掌鞫说模驗檫@些控件都是服務器端來處理的。Server Control會在初始化的時候自動生成適合瀏覽器的HTML代碼。這樣在編寫ASP.NET程序的時候，就不必考慮瀏覽器的兼容性問題！ 服務器端控件的執(zhí)行過程是：先在服務器執(zhí)行，根據(jù)執(zhí)行結果生成html元素，然后發(fā)回給客戶端瀏覽器。Web 服務器控件位于以 System.Web.UI.Webcontrols 命名的空間中，并集成在 ASP.NET 的基本類庫中，人們習慣稱為 Web 控件。像 HTML 服務器控

2、件一樣，Web 服務器控件也 是被創(chuàng)建于服務器上并且需要 runat="server" 屬性來工作。然而，Web 服務器控件不是必 須要映射到已存在的 HTML 元素，它們可以表現(xiàn)為更復雜的元素。2.1 WEB 服務器控件的格式Web 服務器控件有兩種具體格式。(1) 所有屬性均定義在一對尖括號“<>”內，并以“asp:”作為前綴標志，以“/”作 為結束標志。其格式形式為：<asp:control_name id="" runat="server" />注意：屬性之間要空格分開。(2) 除了 Text 屬性外，

3、其他屬性均定義在一對尖括號<>內，并以“asp:control_name” 作為前綴標志，以“</asp:control_name>”作為結束標志，Text 屬性放在尖括號和結束標志 的中間。其格式形式為：<asp:control_name attribute1=value1 attribute2=value2 attributeN=valueN> text <asp:control_name>注意：control_name為控件名。示例：<asp:Label ID="Label1" runat="server

4、" Text="Label" Width="237px"></asp:Label> <asp:ImageButton ID="ImageButton1" runat="server" />2.2 服務器控件的類型ASP.NET提供了兩種不同類型的服務器控件：HTML服務器控件和Web服務器控件。這兩種類型的控件大不相同，在使用ASP.NET時，就會看出重 點是Web服務器控件。這并不是說，HTML服務器控件沒有用，它們提供了許多功能，其中一些功能Web服務器控件也沒有。2.3

5、 用服務器控件建立頁面使用服務器控件構建ASP.NET頁面有兩種方式?？梢钥梢暬匕芽丶戏诺皆O計界面上，操縱該控件的行為。也可以直接通過輸入代碼來處理服務器控件。 在設計界面上使用服務器控件高級編程)Visual Studio 2005允許可視化地把控件拖放到設計界面上，可視化地創(chuàng)建ASP.NET頁面。要獲得這個可視化的設計選項，可以在查看ASP.NET頁面時，單擊 IDE底部的Design選項卡。在這個視圖中，可以把光標放在希望控件出現(xiàn)的地方，再在Visual Studio的Toolbox窗口中雙擊需要的控件。在頁面的Design視圖中，可以突出顯示一個控件，該控件的屬性就會顯示在Prop

6、erties窗口中。例如，在圖4-1中，在設計面板上選擇Button控件，其屬性就顯示在右下角的Properties窗口中。圖  4-1在這個窗口中修改屬性，就會改變突出顯示的控件的外觀或行為。所有的控件都繼承了一個特定的基類(WebControl)，所以還可以同時突出顯示多個控件，一次改變這些控件的基本屬性。在選擇控件時，需要按住Ctrl鍵。 在Source界面使用服務器控件與Design視圖一樣，頁面的Source視圖也允許把控件從Toolbox拖放到代碼頁面上。例如，把一個TextBox控件拖放到代碼頁面上，與把它拖放到設計界面上的效果相同：<asp:TextBox ID

7、="TextBox1" Runat="server"></asp:TextBox>也可以在Source視圖中突出顯示一個控件，或把光標放在該控件的代碼語句上，Properties窗口就會顯示該控件的屬性?，F(xiàn)在就可以直接應用Visual Studio的Properties窗口中的屬性了，這些屬性會動態(tài)添加到控件的代碼中。 處理服務器控件的事件例如，窗體上按鈕的一個常見事件是Button_Click，如程序清單所示。處理按鈕單擊事件protected void Button1_Click(object sender，EventArgs e)

8、   / Code actions here程序清單中的事件僅在終端用戶單擊了窗體上的按鈕時才觸發(fā)，該窗體具有Button1_Click的OnClick屬性值。所以事件處理程序不僅存在于ASP.NET頁面的服務器端代碼上，還使 用相關的ASP.NET頁面標記中的服務器控件的OnClick屬性關聯(lián)起來，如下面的代碼所示：<asp:Button ID="Button1" Runat="server" Text="Button" OnClick="Button1_Click" />如何觸發(fā)

9、服務器控件的這些事件？有兩種方式。第 一種方式是在Design視圖中打開ASP.NET頁面，雙擊要創(chuàng)建服務器端事件的控件。例如，雙擊Design視圖中的Button服務器控件，無論代 碼是在后臺編碼文件中，還是內置代碼，都會在服務器端代碼中創(chuàng)建Button1_Click事件的結構。這會為該服務器控件最常用的事件創(chuàng)建一個處理程序 框架。如前所述，注意Button控件有非常多的事件，雙擊該控件并不能得到這些事件。為了訪問這些事件，應打開包含服務器端代碼的頁面，從IDE頂部的第一個下拉列表中選擇該控件，再在第二個下拉列表中 選擇該控件需要的事件。下圖顯示了事件下拉列表。例如，處理Button控件的P

10、reRender事件，而不是其Click事件。該事件的處理程序會 放在服務器端代碼中。第二種方式是在Visual Studio的Properties窗口中為服務器控件創(chuàng)建服務器端的事件。這種方式只能用于頁面的Design視圖。在Design視圖中，突出顯示要 處理的服務器控件，該控件的屬性和一個圖標菜單就會出現(xiàn)在Properties窗口中。其中一個圖標是事件圖標，用一個閃電圖形表示，如圖所示。單擊事件圖標會打開該控件的可用事件列表。雙擊其中一個事件，就會在服務器端代碼中創(chuàng)建該事件的結構。有了事件的結構后，就可以編寫觸發(fā)事件時希望發(fā)生的特定操作了。2.4 控件的常見屬性ASP.NET 2.0的許

11、多服務器控件都派生于WebControl類，擁有公共屬性，并不是所有的服務器控件都派生于WebControl類中。例如，Literal、 PlaceHolder、Repeater和XML服務器控件就不是派生于WebControl基類，而是派生于Control類。HTML服務器控件也沒有派生于WebControl基類，因為它們主要用于設置HTML元素的屬性。表4-2列出了服務器控件都有的公共屬性。屬    性說    明AccessKey允許賦予與Alt鍵相關的一個字符，這樣終端用戶就可以使用鍵盤上的快捷鍵激活控件了。例如，給Butto

12、n 控件的AccessKey屬性賦予K。這樣，終端用戶就不需要單擊ASP.NET頁面上的按鈕(使用鼠標控制的指針)，而可以按下Alt+K Attributes允許為Web服務器控件定義公共屬性未定義的額外屬性BackColor控制ASP.NET頁面上控件的背景色BorderColor給服務器控件的邊框設置顏色BorderWidth給組成控件邊框的線設置線寬值。把一個數(shù)字設置為該值，就是把該數(shù)字設置為邊框的寬度像素值。如果BorderColor屬性沒有與BorderWidth屬性設置一起使用，默認的邊框顏色就是黑色BorderStyle允許指定服務器控件邊框的設計樣式。邊框默認創(chuàng)建為直線，但可以

13、給邊框使用許多不同的樣式。BorderStyle屬性的其他值有Dotted、Dashed、Solid、Double、Groove、Ridge、Inset和OutsetCssClass給控件指定定制的層疊樣式表(Cascading Style Sheet，CSS)類文件Enabled把這個屬性的值設置為False，就關閉了控件的功能。Enabled屬性默認設置為True (續(xù)表)   屬    性說    明EnableTheming允許為所選的服務器控件打開主題功能。其默認值是True。這是.NET Framewo

14、rk 2.0中的一個新屬性Font設置控件中所有文本的字體ForeColor設置控件中所有文本的顏色Height設置控件的高度SkinID給控件應用主題時設置要使用的skin。這是.NET Framework 2.0中的一個新屬性Style允許把CSS樣式應用于控件TabIndex設置控件在ASP.NET 頁面中的tab位置。這個屬性與頁面上的其他控件一起使用ToolTip設置當鼠標停留在控件上一小段時間時，出現(xiàn)在瀏覽器的一個黃色框中的文本，它可以用于提供更多的指示給終端用戶Width設置控件的寬度許多服務器控件都有這些公共屬性。在.NET Framework 2.0中，WebControl類

15、的新屬性有EnableTheming和SkinID。2.5 控件的種類控件可以分為：Ø 文本輸入和文本控制的控件Ø 傳輸或定位控制的控件Ø 選擇控件Ø 容器控件 標簽、文本框文本控件主要包括兩種類型，分別為Label和TextBox,其中Label控件一般是用來顯示或提醒用戶的控件，而TextBox一般是用來接受用戶輸入的控件。 Button、ImageButton、LinkButton、HyperLink控件 Ø Button控件默認情況下，Button控件外觀與HTML控件中的提交按鈕相似，都是灰色的。單擊按鈕時，會提交包含按鈕的窗體，并引

16、發(fā)Click事件。Ø ImageButton控件ImageButton服務器控件使用定制圖像作為窗體的按鈕，實現(xiàn)Button的按鈕功能。ImageButton控件的構件代碼所示：<asp:ImageButton ID=”ImageButton1” Runat=”server” OnClick=”ImageButton1_Click” ImageUrl=”MyButton.jpg” />ImageButton控件與Button控件最大的區(qū)別是，ImageButton的OnClick事件有不同的構造，如下程序所示：protected void ImageButton1_Cli

17、ck(object sender, ImageClickEventArgs e) this.Label1.Text = "點擊的x坐標為" + e.X + "縱坐標為" + e.Y; 該構造代碼使用ImageClickEventArge對象，而不是Button控件通常使用的System.EventArgs對象。可以使用這個對象的e.X和e.Y坐標確定終端用戶單擊了圖像的什么位置。Ø LinkButtonLinkButton控件的外觀與HyperLink控件相同，但功能與Button控件相同。Button的重要屬性與事件：l CausesVali

18、dation屬性如果Web頁面上有多個按鈕，對于不要求觸發(fā)驗證的按鈕，設置CausesValidation設置為False。l CommandName屬性設置按鈕的命令名稱，通過命令參數(shù)傳遞給按鈕的Command事件。 l Command事件單擊按鈕時發(fā)生，該事件通常用于一個Command事件響應函數(shù)處理多個按鈕的Command事件，在事件函數(shù)中通過判定由事件參數(shù)傳入的CommandName判定哪一個按鈕被點擊示例代碼：<asp:Label ID="Label1" runat="server" Text="Label">&

19、lt;/asp:Label><br /> <asp:Button ID="Button1" runat="server" Text="Button" CommandName="insert" OnCommand="Command" /><asp:Button ID="Button2" runat="server" Text="Button" CommandName="delete"

20、 OnCommand="Command" />代碼：protected void Command(object sender, CommandEventArgs e) switch (e.CommandName) case "insert": this.Label1.Text = "我收到第一個按鈕的命令" break; case "delete": this.Label1.Text = "我收到第二個按鈕的命令" break; default: this.Label1 .Text = &

21、quot;誰發(fā)的命令不知道." break; Ø 使用客戶端JavaScriptButton的OnClientClick屬性可以用來使用JavaScript處理客戶端單擊事件示例：下面頁面包含按鈕客戶端單擊事件，調用javaScirpt函數(shù)AlertHello()。和一個服務器端單擊事件，它們在單擊按鈕時觸發(fā)。首先打開Java Script警告對話框（如圖所示），終端用戶單擊OK之后，頁面再提交服務器觸發(fā)服務器端事件。如下程序清單所示<asp:Label ID="Label1" runat="server" Text="

22、;Label" Width="254px"></asp:Label><br /> <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="hello()" OnClick="Button1_Click" /><script language="jscript">function hello() alert(

23、9;客戶端單擊事件,確認一下');</script>運行結果：Ø HperLink控件HperLink控件可以使一個ASP.NET頁面鏈接到另一個頁面，該控件還可以將文本或圖像顯示為鏈接。表列出此控件所有的常用屬性。HperLink控件主要用于定位到其他網(wǎng)頁，并不公開任何事件。Webforms上的控制權轉移的步驟如下所示：（1） 新建一個Visual C# ASP.NET應用程序并將其命名為Example2。（2） 將默認Web窗體重命名為“ControlTransferDemo.aspx”。 （3） 通過向Web窗體添加兩個標簽、兩個按鈕和一個超鏈接，設計此We

24、b窗體的界面，如圖所示，表列出一要為這些控件設置的種種屬性。表ControlTransferDemo的屬性控件屬性值LabelIDlblHdrLabelIDlblStatusButtonIDbtnTenNewsButtonText網(wǎng)球新聞ImageButtonIDimgBtnSoccerImageButtonimageUrl<<圖像的路徑>>HyperLinkIDlnkTargetHyperLinkText板球新聞HyperLinkNavigateUrlHyperLinkTarget_blankØ 將以下代碼（粗體）添加到Button和ImagButton控件

25、的Click事件。編譯和運行該示例。 選擇控件有時候，可能需要從選項中選擇一個或多個選項，在這種情況下，通過使用ASP.NET中的選擇控件來進行選擇。通過使用Web控件，可以向窗體添加4種主要類型的選擇控件。Ø CheckBox:為用戶提供一種方法在true/fals、yes/no或on/off 選項之間切換。Ø RadioButton:用于只從選項列表中選擇一個選項。Ø DropDownList:允許用戶從預定義列表中選擇一項。Ø ListBox:允許用戶從預定義列表中選擇一項或多項。接下來對每個控件做具體敘述。CheckBox控件有多個選項且用戶可以

26、選擇多個選項時，則使用CheckBox控件。Ø RadioButton控件有多個選項且用戶只能選擇一個選項時，則使用RadioButton控件, DropDownList控件表示允許用戶從下拉列表中選擇一項的控件。Ø ListBox控件ListBox允許用戶從預定義列表中選擇一項或多項。與DropDownList控件不同之處在于ListBox控件可以一次顯示多項，并根據(jù)需要允許用戶選擇多頁，而DropDownList只能顯示一個，并且用戶只能選擇一個。以下是演示這些控件的示例的步驟。（1）新建一個VisualC# ASP.NET應用程序并將其命名為Example3。（2）將

27、Webform重命名為“SelectionControlsDemo.aspx”（3）通過向Web窗體添加7個標簽、兩個文本框、兩個單選按鈕、5個復選框、1個下拉列表、1個列表框和1個按鈕，設計如圖所示的Web窗機界面。（4）下表列出了要為這些控件設置的各種屬性控件 屬性值 LabelID lblNameLabelText姓名LabelID lblGenderLabelText性別LabelID lblAgeLabelText年齡LabelID lblSalLabelText薪水范圍 LabelID lblHobbyLabelText愛好 LabelID lblOwnershipLabelTex

28、t所有權LabelID lblInfoTextBoxIDtxtNameTextBoxIDtxtAgeRadioButtonIDradGenderMRadioButtonText男RadioButtonGroupNameChooserRadioButtonIDradGenderFRadioButtonText女RadioButtonGroupNameChooserCheckBoxIDchkMusicCheckBoxText音樂CheckBoxIDchkNetSurfingCheckBoxText網(wǎng)上沖浪CheckBoxIDchkReadingCheckBoxText閱讀CheckBoxIDchk

29、GamesCheckBoxText游戲CheckBoxIDchkOthersCheckBoxText其他DropDownListIDcboSalRangeListBoxIDlstOwnershipButtonIDbtnSubmitButtonText完成private string strGender="" private string strSalRange="" private string strHobbies=""private string strOwnership="" private void Pag

30、e_Load(object sender, System.EventArgs e)if(!IsPostBack)cboSalRange.Items.Add("小于 $10000");cboSalRange.Items.Add("$10000 至 $20000");cboSalRange.Items.Add("$20001 至 $40000");cboSalRange.Items.Add("$40001 至 $60000");cboSalRange.Items.Add("$60001 至 $80000&qu

31、ot;);lstOwnership.Items.Add("公寓住宅");lstOwnership.Items.Add("土地");lstOwnership.Items.Add("有價證券");private void btnSubmit_Click(object sender, System.EventArgs e)lblInfo.Text=lblInfo.Text + "姓名：" + txtName.Text + " " ;lblInfo.Text=lblInfo.Text + "性

32、別：" + strGender + " " ;lblInfo.Text=lblInfo.Text + "年齡：" + txtAge.Text + " " ;lblInfo.Text=lblInfo.Text + "薪水范圍：" + strSalRange + " " ;lblInfo.Text=lblInfo.Text + "愛好：" + strHobbies + " " ;lblInfo.Text=lblInfo.Text + "所有

33、權：" + strOwnership ;private void radGenderM_CheckedChanged(object sender, System.EventArgs e)strGender="男"private void radGenderF_CheckedChanged(object sender, System.EventArgs e)strGender="女"private void cboSalRange_SelectedIndexChanged(object sender, System.EventArgs e)str

34、SalRange= cboSalRange.SelectedItem.Text;private void chkMusic_CheckedChanged(object sender, System.EventArgs e)if(strHobbies="")strHobbies=strHobbies + chkMusic.Text;elsestrHobbies=strHobbies + "," + chkMusic.Text;private void chkNetSurfing_CheckedChanged(object sender, System.Ev

35、entArgs e)if(strHobbies="")strHobbies=strHobbies + chkNetSurfing.Text;elsestrHobbies=strHobbies + "," + chkNetSurfing.Text;private void chkReading_CheckedChanged(object sender, System.EventArgs e)if(strHobbies="")strHobbies=strHobbies + chkReading.Text;elsestrHobbies=st

36、rHobbies + "," + chkReading.Text;private void chkGames_CheckedChanged(object sender, System.EventArgs e)if(strHobbies="")strHobbies=strHobbies + chkGames.Text;elsestrHobbies=strHobbies + "," + chkGames.Text;private void chkOthers_CheckedChanged(object sender, System.Eve

37、ntArgs e)if(strHobbies="")strHobbies=strHobbies + chkOthers.Text;elsestrHobbies=strHobbies + "," + chkOthers.Text;private void lstOwnership_SelectedIndexChanged(object sender, System.EventArgs e)if(strOwnership="")strOwnership=strOwnership + lstOwnership.SelectedValue;e

38、lsestrOwnership=strOwnership + "," + lstOwnership.SelectedValue;2.5.4 Panel和PlaceHolder控件ASP.NET中有兩種類型的容器控件，分別為Panel和 PlaceHolder控件。Ø Panel控件Panel Web服務器控件提供一個位于Web窗體頁的容器控件，該控件可用作靜態(tài)文本和其他控件的父級。Panel控件適用于以下情況。l 團體行為：將一組控件放置在一個面板，然后對該面板進行操縱，則可以將這組控件作為一個單元進行管理。例如，設置面板的的Visible屬性，可能隱藏或顯示面板

39、中的一組屬性。l 在運行時創(chuàng)建控件：Panel控件為在運行時創(chuàng)建的控件提供了一個方便的容器。l 外觀：Panel控件支持外觀屬性（如BackColor和BorderWidth），設置這些外觀屬性可以為頁面本區(qū)創(chuàng)建一個獨特的外觀。注意：對如RadioButton等控件進行了分組時，無需使用Panel控件。Ø PlaceHoler控件用作存儲運行時添加到網(wǎng)頁上的Web服務器控件的容器。PlaceHolder控件不生成任何可見的輸出結果，只是用作網(wǎng)頁上其他控件的容器。PlaceHolder控件的Control.Controls集合可以用于添加或刪除PlaceHolder控件中的控件。屬性：

40、最常用屬性是用于添加/刪除此容器控件的子控件的Controls屬性。事件：所有事件都繼承自WebControl類。通常不處理此控件的事件，子控件的的特定事件按照控件的方式進行處理。以下是使用PlaceHolder的示例（1） 新建一個Visual C# ASP.NET應用程序，并將其命名為Example4。（2） 將Webform命名為”ContainerControlsDemo.aspx”。（3） 通過添加Panel控件和PlaceHolder控件，設計如圖所示的Web窗體界面，表列出了要為控件設置的各種屬性。控件屬性值PanelIDpnlAddPlacHolderIDphControlsT

41、extBoxIDtxtNameRadioButtonListIDItemsRepeatDirectionrdlSex男，女，默認男被選中Horizontal(水平)TextBoxIDtxtNumberCheckBoxListIDItemsRepeatDirection（4） 定義全局變量。（5） 將以下代碼添加到Page_Load 事件。private int nNumber;private void Page_Load(object sender, System.EventArgs e)if (!Page.IsPostBack )nNumber=0;（6）將下列代碼輸入btnAdd_Clickprivate void btnAdd_Click(object sender, System.EventArgs e)Panel pnPerson=new Panel() ;Table tbTemp=new Table();switch(nNumber % 3)case 1:pnPerson.BackColo