《用讓用戶從可選項中選取一個或多個選項包括》由會員分享,可在線閱讀,更多相關《用讓用戶從可選項中選取一個或多個選項包括(38頁珍藏版)》請在技術文庫上搜索。
1、n2.1.5 選擇控件 n選擇控件的作用是讓用戶從可選項中選取一個或多個選項 ,包括RadioButton和RadioButtonList控件、CheckBox和 CheckList控件、ListBox和DropDownList控件。 n1RadioButton和RadioButtonList控件 n單選按鈕Web服務器控件分為兩類:RadioButton控件和 RadioButtonList控件??梢允褂眠@些控件定義任意數目的 帶標簽的單選按鈕,并將它們水平或垂直排列。 n(1)RadioButton控件 n語法格式如下: n n在程序中可以用“控件名稱.SelectedItem.Value。
2、”獲取被選中 按鈕的選項值,用“控件名稱.SelectedItem.Text”獲取被選 中按鈕旁顯示的文本。 n使用單個RadioButton控件時,一般方法是:向頁面添加一 組這樣的控件,然后對它們進行分組??梢詣摻ǘ鄠€不同 的按鈕組。向Web窗體頁添加RadioButton控件的方法如下 。 n 從工具箱的“標準”選項卡中,將RadioButton控件拖到頁 面上。 n 在“屬性”窗口中,通過設置Text屬性來指定標題。 n 還可以通過設置TextAlign屬性來更改標題的方向。 n 對要添加到頁面上的每個單選按鈕重復步驟。 n 對添加到頁面上的各個RadioButton控件進行分組。 n。
3、 設置選定的RadioButton控件,將控件的Checked屬性設置 為true。 n要確定一組中哪個控件被選中,必須分別測試每個控件,代碼示例如 下: npublic void Button1_Click (object sender, System.EventArgs e) n n if (RadioButton1.Checked) /測試第1個單選按鈕是否選中 n n Label1.Text = You selected + RadioButton1.Text; n n else if (RadioButton2.Checked) /測試第2個單選按鈕是否選中 n n Label1.T。
4、ext = You selected + RadioButton2.Text; n n else if (RadioButton3.Checked) /測試第3個單選按鈕是否選中 n n Label1.Text = You selected + RadioButton3.Text; n n n在一般情況下,不需要直接對RadioButton控件的選擇事件 進行響應,僅當有必要知道用戶何時更改了單選按鈕組中 的選擇內容時,才響應這一事件。 n當用戶選擇RadioButton控件時的響應方法如下: npublic void RadioButton1_CheckedChanged (object s。
5、ender, System.EventArgs e) n n Label1.Text = You selected Radio Button + RadioButton1.Text; n n(2)RadioButtonList控件 n語法格式如下: n n 單選按鈕旁顯示的 文字1 n 單選按鈕旁顯示的文 字2 n 單選按鈕旁顯示的文字3 n n n向Web頁添加一個RadioButtonList控件,然后向該控件添 加列表項,操作方法如下。 n 從工具箱的“標準”選項卡中,將RadioButtonList控件拖 到頁面上。 n 可以在“屬性”窗口中,設置TextAlign屬性來更改標題的 方。
6、向,設置RepeatDirection來更改控件的布局,指定各項 的排序方式:Vertical(垂直,默認)或Horizontal(水平 )。 n 可以使用以下3種方法向列表服務器控件添加項: n在設計時添加靜態項。 n以編程方式在運行時添加項。 n使用數據綁定添加項,將在后面章節中詳細介紹。 n在設計時添加靜態項的方法如下。 n 在設計視圖中,選擇要向其中添加項的列表控件。 nRadioButtonList控件添加到頁面中后,自動顯示如圖2-10 所示的快捷菜單,其中,“選擇數據源”用于將控件綁定到 某個數據庫指定的字段上。如果快捷菜單被隱藏,可單擊 該控件右上角的 按鈕將其展開。在快捷菜單。
7、中單擊“編輯 項”,或者在“屬性”窗口中,單擊Items屬性后的 按鈕,都 將顯示“ListItem集合編輯器”對話框,如圖2-11所示。 n 單擊“添加”按鈕向單選按鈕組中添加成員。在每個成員 名稱之前帶有一個數字編號,該編號為成員控件的索引號 (Index)??赏ㄟ^SelectedIndex屬性獲取或設置 RadioButtonList控件中被選定成員的索引號。 n 選擇此新項,然后在右側列表框中設置Text、Value、 Selected等屬性值。最多可以為該項指定4個可能的屬性, 見表2-16。 n 對要添加的每項重復步驟和步驟,然后單擊“確定” 按鈕。 n以編程方式添加項的方法如下。。
8、 nRadioButtonList控件為網頁開發人員提供了一組單選按鈕 ,這些按鈕可以通過數據綁定動態生成。該控件包含一個 Items集合,集合中的成員與列表中的各項相對應。若要確 定選擇了哪項,則需要測試列表的SelectedItem屬性。 n 創建ListItem類型的新對象,設置其Text屬性和Value屬 性。在程序中,通常通過調用Add方法來創建新的ListItem 。 n 調用控件的Items集合的Add方法,并將新對象傳遞給它 ,代碼如下: nRadioButtonList1.Items.Add(new ListItem(Text文本1, Value值1); nRadioButt。
9、onList1.Items.Add(new ListItem(Text文本2, Value值2); n【演練2-5】 RadioButton和RadioButtonList控件應用示例 。制作小調查網頁,列出兩組單選按鈕,供用戶選擇。選 擇后,將顯示被選中的項目,如圖2-12所示;如果沒有選 擇任何單選按鈕,則顯示相應的提示,如圖2-13所示。 n 設計頁面。新建一個空網站,添加Web窗體,切換到設 計視圖,在Default.aspx中添加一個5行2列的表格,并輸入 相應的靜態文字,添加4個RadioButton控件、一個 RadioButtonList控件、兩個Button控件、一個Labe。
10、l控件。 由于VS自動添加CSS代碼,致使不容易控制表格寬度,需 要將其刪掉,切換到源視圖,刪除中的及其樣式表代碼。其設計視圖如 圖2-14所示。 n 設置控件屬性。在設計視圖中,分別選中4個 RadioButton控件,把它們的GroupName屬性都設置為 Times,Text屬性設置如圖2-15所示。 n選中RadioButtonList控件,在ListItem集合編輯器中添加6 個選項,它們的Text屬性設置如圖2-15所示,設置 RepeatDirection屬性為Horizontal。 n 編寫事件代碼。 n【演練2-5】代碼 n2CheckBox和CheckList控件 n(1)。
11、CheckBox控件 n語法格式如下: n n(2)CheckList控件 n語法格式如下: n n 復選框旁顯示的文字 1 n 復選框旁顯示的文字 2 n 復選框旁顯示的文字3 n n n【演練2-6】 CheckBox和CheckList控件應用示例。制作選 擇愛好示例,當單擊選中CheckBox控件時,將改變 CheckBoxList控件的顯示方式;當單擊Button控件時,在 Label控件中顯示選定的項目。如圖2-16所示。 n 設計頁面。新建空網站,添加Web窗體,切換到設計視 圖,在Default.aspx中添加一個CheckBoxList控件、一個 CheckBox控件、一個B。
12、utton控件、一個Label控件,如圖2- 17所示。 n 設置控件屬性。在設計視圖中,選中CheckBoxList1控件 ,在ListItem集合編輯器中添加8個選項,分別設置它們的 Text屬性如圖2-18所示,在“屬性”窗口中設置RepeatColumns 屬性值為2,將該控件適當拖大一些,以便在橫向顯示時使 文字顯示正常(即在程序中把RepeatColumns屬性設為4時的 大?。?。選中CheckBox1控件,設置Text屬性值為“水平顯示 ”,AutoPostBack屬性值為true。將Button控件的Text屬性值改 為“提交”,Label控件的Text屬性中的內容清空。 n 。
13、編寫事件代碼。 n【演練2-6】代碼 n3ListBox控件和DropDownList控件 nListBox(列表框)控件和DropDownList(下拉列表框) 控件是用于向用戶提供輸入數據選項的控件,其外觀分別 如圖2-19和圖2-20所示。從圖中可以看出,ListBox控件和 DropDownList控件都是以列表的形式向用戶提供選項的, 但DropDownList控件可以將選項折疊起來,只有在用戶單 擊其右側的下拉按鈕 時才顯示選項列表,節省了顯示空 間。 n(1)ListBox控件 nListBox控件的語法格式如下: n n 列表框中顯示的文字 1 n 列表框中顯示的文字 2 n 。
14、列表框中顯示的文字3 n n n向控件中添加選項的方法與前面介紹過的RadioButtonList 控件、CheckBoxList控件添加選項的方法相同,可以通過 ListItem集合編輯器添加選項,也可以在源視圖中通過編 寫HTML代碼添加選項,還可以在程序運行中通過代碼動 態地向控件中添加選項。 n在程序中可用“列表控件名稱.SelectedItem”或“列表控件名 稱.SelectedItem.Text”獲取被選項的文本,用“列表控件名 稱.SelectedValue”或“列表控件名稱.SelectedItem.Value”獲 取被選項的值。 n當ListBox控件允許多選時,要通過循環。
15、來依次判斷哪些選項被選中。 事件過程代碼如下: nprotected void Button1_Click(object sender, EventArgs e) n n Label1.Text = 你選中的選項為:; n for (int i = 0; i ListBox1.Items.Count; i+) /獲取列表選項總數 .Items.Count n n if (ListBox1.Itemsi.Selected) /如果本選項 被選中 n n Label1.Text += ListBox1.Itemsi.Value + ; n n n n要選中多項,按下Ctrl鍵操作鼠標可選中不連續的。
16、多項,按下Shift鍵 操作鼠標可選中連續的多項。 n(2)DropDownList控件 nDropDownList控件的語法格式如下: n n 下拉列表框中顯示 的文字1 n 下拉列表框中顯示的 文字2 n 下拉列表框中顯示的文字 3 n n n【演練2-7】 ListBox控件和DropDownList控件應用示例。 要求分別在ListBox控件和DropDownList控件中選定一個 選項,單擊“確定”按鈕后顯示選定的項目名稱,如圖2-21 所示。如果沒有選項,則提示“請選項目!”;如果單擊“重 選”按鈕,則恢復到選擇前的狀態。 n 設計頁面。新建空網站,添加Web窗體,切換到設計視圖 。
17、,在Default.aspx中添加一個6行2列,寬度為600像素的 HTML表格,然后合并第4、6行的單元格。添加靜態文字, 添加一個ListBox控件、一個DropDownList控件、兩個Button 控件、一個Label控件。單擊DropDownList控件所在的單元 格(不能選中DropDownList控件),在“屬性”窗口中設置本 單元格的align屬性值為left,valign屬性值為top,使 DropDownList控件位于單元格左上角,如圖2-22所示。 n 設置控件屬性。在設計視圖中,分別選中ListBox1控件 和DropDownList1控件,在ListItem集合編輯。
18、器中添加選項 。 n 編寫事件代碼。 n【演練2-7】代碼 n【演練2-8】 ListBox控件應用示例。如圖2-23所示,左邊 ListBox控件顯示預定義選項列表,在左邊列表框中單擊選 中項目,單擊 按鈕,移到右邊的ListBox控件中;單擊 按 鈕則把右邊選中的項移到左邊。如果沒有選中而直接單擊 按鈕,則出現提示對話框。 n 設計頁面。新建空網站,添加Web窗體,切換到設計視 圖,在Default.aspx中添加一個3行3列、500像素寬度的表 格,添加兩個ListBox控件、兩個Button控件,調整表格、 控件的大小,如圖2-24所示??稍谠匆晥D中精確設置控件 的Height、Wid。
19、th的大小。 n 設置控件屬性。在設計視圖中,選中ListBox1控件,在 ListItem集合編輯器中添加選項。兩個ListBox控件的 SelectionMode屬性應使用默認的Single,以確保一次只能 選中一項。Button控件的Text屬性分別設置為“”和“” 。 n 編寫事件代碼。 n【演練2-8】代碼 n【實訓2-2】 常用標準控件應用示例,制作用戶注冊頁面 ,如圖2-50所示。用戶填寫注冊內容后,單擊“提交”按鈕 ,在頁面下方顯示填寫的內容;單擊“重置”按鈕,清空內 容。 2.5 實訓 n 設計頁面。新建一個ASP.NET網站,在解決方案資源 管理器中右擊Default.as。
20、px,在快捷菜單中單擊“重命名”, 將其改名為Login.aspx。在Login.aspx頁面中,按圖2-50所 示添加一個用于布局的HTML表格。注意,在插入表格時 ,要指定寬度并采用像素為單位。向表格中添加用于表示 各控件作用的說明文字。向表格中添加5個TextBox控件、 一個RadioButtonList控件、3個DropDownList控件、一個 CheckBoxList控件、兩個Button控件、一個Label控件。適 當調整表格、各控件的大小和位置。 n 設置對象屬性。設置頁面中各控件對象的屬性,見表2- 26。 n對于列表框控件,在設計時通過ListItem集合編輯器添加 選項。
21、。對于有些必選項,為了防止漏選,也為了簡化程序 ,可設定一個默認選項,即在設置ListItem時,將該成員 控件的Selected屬性值設置為true,使之成為默認選項。 n 編寫事件代碼。 n【實訓2-2】代碼 n【實訓2-3】 設計一個可以在網頁中動態更改文本框中字 體、字形和字號的程序。如圖2-51所示,頁面打開后,用 戶可使用程序提供的單選按鈕、復選框和下拉列表框更改 文字樣式。 n【實訓2-4】 使用Image控件和LinkButton控件設計一個簡 單圖片瀏覽器。程序啟動后顯示如圖2-52所示的頁面,圖 片下方顯示有當前圖片的序號。要求:當頁面中顯示第1 張圖片時,“上一張”按鈕不可用,當頁面中顯示第2、3張 圖片時兩個按鈕均可用,當顯示最后一張(第4張)圖片 時,“下一張”按鈕不可用。 n【實訓2-5】 設計發表評論網頁,如圖2-53所示。要求: 如果未選中“匿名”復選框,則“登錄”和“密碼”文本框可見 ,如圖2-54所示;如果選中“匿名”復選框,則“登錄”和“密 碼”文本框不可見,如圖2-55所示。單擊“提交”按鈕在頁面 下部顯示輸入的內容。 再見再見。