ASP.NET - 基本控制元件

上一頁
下一頁

本章將討論 ASP.NET 中提供的基本控制元件。

按鈕控制元件

ASP.NET 提供三種類型的按鈕控制元件

  • 按鈕 (Button)：在矩形區域內顯示文字。

  • 連結按鈕 (Link Button)：顯示看起來像超連結的文字。

  • 圖片按鈕 (Image Button)：顯示影像。

當用戶單擊按鈕時，會引發兩個事件：Click 和 Command。

按鈕控制元件的基本語法

<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Click" / >

按鈕控制元件的常用屬性

屬性 描述
Text 在按鈕上顯示的文字。僅適用於按鈕和連結按鈕控制元件。
ImageUrl 僅適用於圖片按鈕控制元件。按鈕要顯示的影像。
AlternateText 僅適用於圖片按鈕控制元件。如果瀏覽器無法顯示影像，則顯示的文字。
CausesValidation 確定使用者單擊按鈕時是否發生頁面驗證。預設值為 true。
CommandName 使用者單擊按鈕時傳遞給命令事件的字串值。
CommandArgument 使用者單擊按鈕時傳遞給命令事件的字串值。
PostBackUrl 使用者單擊按鈕時請求的頁面的 URL。

文字框和標籤

文字框控制元件通常用於接受使用者的輸入。文字框控制元件可以接受一行或多行文字，具體取決於 TextMode 屬性的設定。

標籤控制元件提供了一種簡單的方法來顯示文字，該文字可以在頁面的每次執行之間更改。如果要顯示不變的文字，則可以使用文字文字。

文字控制元件的基本語法

<asp:TextBox ID="txtstate" runat="server" ></asp:TextBox>

文字框和標籤的常用屬性

屬性 描述
TextMode 指定文字框的型別。SingleLine 建立標準文字框，MultiLine 建立接受多行文字的文字框，Password 會使輸入的字元被遮蔽。預設為 SingleLine。
Text 文字框的文字內容。
MaxLength 可以輸入到文字框中的最大字元數。
Wrap 確定多行文字框中的文字是否自動換行；預設為 true。
ReadOnly 確定使用者是否可以更改框中的文字；預設為 false，即使用者無法更改文字。
Columns 文字框的寬度（以字元為單位）。實際寬度根據用於文字輸入的字型確定。
Rows 多行文字框的高度（以行為單位）。預設值為 0，表示單行文字框。

標籤控制元件最常用的屬性是“Text”，它表示在標籤上顯示的文字。

複選框和單選按鈕

複選框顯示使用者可以選中或取消選中的單個選項，而單選按鈕則提供一組選項，使用者只能從中選擇一個選項。

要建立一組單選按鈕，請為組中每個單選按鈕的 GroupName 屬性指定相同的名稱。如果單個表單中需要多個組，則為每個組指定不同的組名。

如果希望在最初顯示錶單時選中複選框或單選按鈕，請將其 Checked 屬性設定為 true。如果組中多個單選按鈕的 Checked 屬性設定為 true，則只有最後一個被視為 true。

複選框的基本語法

<asp:CheckBox ID= "chkoption" runat= "Server"> 
</asp:CheckBox>

單選按鈕的基本語法

<asp:RadioButton ID= "rdboption" runat= "Server"> 
</asp: RadioButton>

複選框和單選按鈕的常用屬性

屬性 描述
Text 複選框或單選按鈕旁邊顯示的文字。
Checked 指定它是否被選中，預設為 false。
GroupName 控制元件所屬的組的名稱。

列表控制元件

ASP.NET 提供以下控制元件

  • 下拉列表
  • 列表框
  • 單選按鈕列表
  • 複選框列表
  • 專案符號列表

這些控制元件允許使用者從列表中選擇一個或多個專案。列表框和下拉列表包含一個或多個列表項。這些列表可以透過程式碼或 ListItemCollection 編輯器載入。

列表框控制元件的基本語法

<asp:ListBox ID="ListBox1" runat="server" AutoPostBack="True"    OnSelectedIndexChanged="ListBox1_SelectedIndexChanged">
</asp:ListBox>

下拉列表控制元件的基本語法

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"   OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>

列表框和下拉列表的常用屬性

屬性 描述
Items 表示控制元件中專案的 ListItem 物件集合。此屬性返回 ListItemCollection 型別的物件。
Rows 指定在框中顯示的專案數。如果實際列表包含的行數多於顯示的行數，則會新增捲軸。
SelectedIndex 當前選中專案的索引。如果選擇了多個專案，則為第一個選中專案的索引。如果沒有選中任何專案，則此屬性的值為 -1。
SelectedValue 當前選中專案的 value 值。如果選擇了多個專案，則為第一個選中專案的 value 值。如果沒有選中任何專案，則此屬性的值為空字串 (“”)。
SelectionMode 指示列表框是否允許單選或多選。

每個列表項物件的常用屬性

屬性 描述
Text 為專案顯示的文字。
Selected 指示專案是否被選中。
Value 與專案關聯的字串值。

需要注意的是

  • 要使用下拉列表或列表框中的專案，請使用控制元件的 Items 屬性。此屬性返回一個 ListItemCollection 物件，其中包含列表的所有專案。

  • 當用戶從下拉列表或列表框中選擇不同的專案時，將引發 SelectedIndexChanged 事件。

ListItemCollection

ListItemCollection 物件是 ListItem 物件的集合。每個 ListItem 物件代表列表中的一個專案。ListItemCollection 中的專案從 0 開始編號。

當使用字串（例如：lstcolor.Items.Add("Blue")）將專案載入到列表框中時，列表項的 Text 和 Value 屬性都將設定為指定的字串值。要分別設定它們，必須建立一個列表項物件，然後將該專案新增到集合中。

ListItemCollection 編輯器用於向下拉列表或列表框新增專案。這用於建立靜態專案列表。要顯示集合編輯器，請從智慧標記選單中選擇“編輯專案”，或選擇控制元件，然後單擊“屬性”視窗中“專案”屬性的省略號按鈕。

ListItemCollection 的常用屬性

屬性 描述
Item(integer) 表示指定索引處的專案的 ListItem 物件。
Count 集合中的專案數。

ListItemCollection 的常用方法

方法 描述
Add(string) 在集合末尾新增一個新專案，並將字串引數賦給專案的 Text 屬性。
Add(ListItem) 在集合末尾新增一個新專案。
Insert(integer, string) 在集合的指定索引位置插入一個專案，並將字串引數賦給專案的 Text 屬性。
Insert(integer, ListItem) 在集合的指定索引位置插入專案。
Remove(string) 刪除文字值與字串相同的專案。
Remove(ListItem) 刪除指定的專案。
RemoveAt(integer) 刪除指定索引處的專案。
Clear 刪除集合中的所有專案。
FindByValue(string) 返回 value 值與字串相同的專案。
FindByText(string) 返回 text 值與字串相同的專案。

單選按鈕列表和複選框列表

單選按鈕列表提供一組互斥選項。複選框列表提供一組獨立選項。這些控制元件包含一個 ListItem 物件集合，可以透過控制元件的 Items 屬性引用。

單選按鈕列表的基本語法

<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="True" 
   OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
</asp:RadioButtonList>

複選框列表的基本語法

<asp:CheckBoxList ID="CheckBoxList1" runat="server" AutoPostBack="True" 
   OnSelectedIndexChanged="CheckBoxList1_SelectedIndexChanged">
</asp:CheckBoxList>

複選框列表和單選按鈕列表的常用屬性

屬性 描述
RepeatLayout 此屬性指定在呈現列表時使用表標籤還是普通 HTML 流進行格式化。預設為 Table。
RepeatDirection 它指定重複控制元件的方向。可用的值為 Horizontal 和 Vertical。預設為 Vertical。
RepeatColumns 它指定在重複控制元件時使用的列數；預設為 0。

專案符號列表和編號列表

專案符號列表控制元件建立專案符號列表或編號列表。這些控制元件包含一個 ListItem 物件集合，可以透過控制元件的 Items 屬性引用。

專案符號列表的基本語法

<asp:BulletedList ID="BulletedList1" runat="server">
</asp:BulletedList>

專案符號列表的常用屬性

屬性 描述
BulletStyle 此屬性指定專案符號或數字的樣式和外觀。
RepeatDirection 它指定重複控制元件的方向。可用的值為 Horizontal 和 Vertical。預設為 Vertical。
RepeatColumns 它指定在重複控制元件時使用的列數；預設為 0。

超連結控制元件

超連結控制元件類似於 HTML <a> 元素。

超連結控制元件的基本語法

<asp:HyperLink ID="HyperLink1" runat="server">
   HyperLink
</asp:HyperLink>

它具有以下重要屬性

屬性 描述
ImageUrl 控制元件將顯示的影像路徑。
NavigateUrl 目標連結 URL。
Text 顯示為連結的文字。
Target 載入連結頁面的視窗或框架。

影像控制元件

影像控制元件用於在網頁上顯示影像，如果影像不可用，則顯示替代文字。

影像控制元件的基本語法

<asp:Image ID="Image1" runat="server">

它具有以下重要屬性

屬性 描述
AlternateText 影像不存在時顯示的替代文字。
ImageAlign 控制元件的對齊選項。
ImageUrl 控制元件將顯示的影像路徑。
列印頁面
上一頁
下一頁
廣告