網(wǎng)頁(yè)標(biāo)準(zhǔn)控件的使用.ppt

1、從標(biāo)準(zhǔn)控件開始,Web服務(wù)器端控件、HTML控件和用戶自定義控件是ASP.NET支持的三種控件。Web服務(wù)器端控件是ASP.NET首選控件，包括標(biāo)準(zhǔn)控件和驗(yàn)證控件，我們重點(diǎn)的關(guān)注是常用Web服務(wù)器端標(biāo)準(zhǔn)控件。,服務(wù)器端控件概述,Web服務(wù)器端控件是ASP.NET重要的組成部分。服務(wù)器端控件包含方法以及與之關(guān)聯(lián)的事件處理程序，并且這些代碼都在服務(wù)器端執(zhí)行。 Web服務(wù)器端控件先在服務(wù)器執(zhí)行，執(zhí)行的結(jié)果以HTML的形式發(fā)送給客戶端瀏覽器進(jìn)行解析，這樣在使用ASP.NET編寫服務(wù)器端程序時(shí)，不必考慮客戶瀏覽器的兼容性問題。,Web服務(wù)器端標(biāo)準(zhǔn)控件類型,Web服務(wù)器端標(biāo)準(zhǔn)控件結(jié)構(gòu),格式如下： 或者寫成

2、 代碼需要寫在一對(duì)尖括號(hào)內(nèi)，前綴asp為必加項(xiàng)，Control表示控件的類型；ID為該控件的屬性，是控件的唯一標(biāo)識(shí)，即編程時(shí)使用的名字；runat是固有屬性，其值為固定值“server”，表示這是一個(gè)服務(wù)器端控件。根據(jù)實(shí)際情況，里面還可以有更多的屬性，可以在屬性窗口設(shè)置或在源代碼中直接添加。 實(shí)例演示,“學(xué)生基本信息登記表”案例,“學(xué)生基本信息登記表”案例步驟,1. 創(chuàng)建一Web窗體文件 2. 頁(yè)面的界面設(shè)計(jì) 1)使用HTML中的表格控件搭建頁(yè)面框架 2)界面設(shè)計(jì)，在表格中添加各種控件 3. 為控件添加腳本 4. 測(cè)試頁(yè)面,給RadioButtonList控件添加腳本,protected vo

3、id radlistLanguage_SelectedIndexChanged1(object sender, EventArgs e) if (radlistLanguage.SelectedItem.Text = 其他) lblLanguage.Text = 您的外語(yǔ)種類是：; Panel1.Visible = true; else Panel1.Visible = false; ,本節(jié)知識(shí)點(diǎn),1. 文本框控件（TextBox） 2. 三種按鈕控件(Button、ImageButton和LinkButton控件) 3. 顯示控件(Label控件、Image控件) 4. 選擇與列表控件(Ra

4、dioButton控件和 RadioButtonList控件、CheckBox控件和CheckBoxList控件、ListBox控件和DropDownList控件) 5. 文件上傳控件(FileUpload控件) 6. Table控件 7. Panel控件和PlaceHolder控件,1. 文本框控件（TextBox）,實(shí)例演示,2. 按鈕控件Button,Button控件，源視圖中對(duì)應(yīng)的標(biāo)簽為： 按鈕控件均可以把頁(yè)面上的輸入信息提交給服務(wù)器，對(duì)其發(fā)生Click（單擊）事件能激活服務(wù)器腳本中對(duì)應(yīng)的事件過(guò)程代碼。 實(shí)例演示,代碼部分,protected void btnButton_Click(

5、object sender, EventArgs e) txtInfo.Text = 您單擊了提交按鈕！; 源代碼視圖模式，Button控件的標(biāo)簽為： OnClick為Button控件的一個(gè)屬性，屬性值為btnButton_Click，表明當(dāng)Button控件發(fā)生Click事件時(shí)，激活了btnButton_Click事件過(guò)程腳本， 該過(guò)程通過(guò)“txtInfo.Text = 您單擊了提交按鈕！”語(yǔ)句，向TextBox控件中寫入“您單擊了提交按鈕！”。,3. 顯示控件(Label控件、Image控件),Label控件用于在頁(yè)面上顯示文本，Image控件用于在頁(yè)面上顯示圖像，使用Image控件的Ima

6、geUrl屬性設(shè)置圖形文件的URL地址，設(shè)置完成后對(duì)應(yīng)的圖標(biāo)才會(huì)顯示相應(yīng)的圖形。 實(shí)例演示,4. 選擇與列表控件,1）RadioButton控件和RadioButtonList控件 2）CheckBox控件和CheckBoxList控件 3）ListBox控件和DropDownList控件,RadioButton控件和 RadioButtonList控件,使用RadioButton控件可以生成一組單選按鈕。 實(shí)例演示 RadioButtonList控件具有和RadioButton控件同樣的功能，并且可以方便管理各個(gè)數(shù)據(jù)項(xiàng)。 實(shí)例演示,RadioButton控件實(shí)例腳本,protected vo

7、id btnSubmit_Click(object sender, EventArgs e) string sex=; if (radMan.Checked=true) sex = 男生; if (radWoman.Checked = true) sex = 女生; lblResult.Text = 您是一名 + sex; ,RadioButtonList控件完成數(shù)據(jù)項(xiàng)的添加后源代碼部分, 英語(yǔ) 俄語(yǔ) 法語(yǔ) ,RadioButtonList控件腳本部分,protected void btnSubmit_Click(object sender, EventArgs e) lblResult.Te

8、xt = 您選擇了 + radlistLanguage.SelectedItem.Text; ,2）CheckBox控件和CheckBoxList控件,CheckBox控件可以生成一組復(fù)選框 實(shí)例演示 CheckBoxList控件 用于生成數(shù)量較多的復(fù)選框 實(shí)例演示,CheckBox控件實(shí)例腳本,protected void btnSubmit_Click(object sender, EventArgs e) string msg = ; if (chkFavorite1.Checked = true) msg = msg + chkFavorite1.Text+ ; if (chkFavo

9、rite2.Checked = true) msg = msg + chkFavorite2.Text + ; if (chkFavorite3.Checked = true) msg = msg + chkFavorite3.Text + ; if (chkFavorite4.Checked = true) msg = msg + chkFavorite4.Text + ; lblResult.Text = 您喜歡 + msg + 。; ,CheckBoxList控件實(shí)例腳本,protected void btnSubmit_Click(object sender, EventArgs e)

10、 string msg=; for (int i = 0; i chklistFavorite.Items.Count-1; i+) if (chklistFavorite.Itemsi.Selected) msg = msg + chklistFavorite.Itemsi.Text + ,3）ListBox控件和DropDownList控件,ListBox控件用于創(chuàng)建允許單選或多選的列表框 實(shí)例演示 DropDownList控件用創(chuàng)建下拉列表框，只能選擇列表框中的某一項(xiàng) 實(shí)例演示,ListBox控件實(shí)例腳本,protected void btnSubmit_Click(object sen

11、der, EventArgs e) string msg = ; for (int i = 0; i lstCourse.Items.Count - 1; i+) if (lstCourse.Itemsi.Selected) msg = msg + lstCourse.Itemsi.Text + ,DropDownList控件實(shí)例腳本,protected void btnSubmit_Click(object sender, EventArgs e) lblResult.Text = 您所在的班級(jí)是 + dlistClass.SelectedItem.Text; ,5. 文件上傳控件(File

12、Upload控件),FileUpload控件可以將用戶提供文件從客戶端傳送到服務(wù)器。通過(guò)設(shè)置控件的相關(guān)屬性，可以控制文件的傳送方式并自動(dòng)完成文件的上傳過(guò)程。,FileUpload控件案例腳本,protected void btnSubmit_click(object sender, EventArgs e) if (FileUpload1.HasFile = true) string strErr = ; /獲得上傳文件的大小 int filesize = FileUpload1.PostedFile.ContentLength; if (filesize 1024 * 1024) strEr

13、r += 文件大小不能大于1Mn; if (strErr = ) string path = Server.MapPath();/獲得服務(wù)器文件當(dāng)前路徑 /把上傳文件保存在當(dāng)前路徑的upload文件夾中 FileUpload1.PostedFile.SaveAs(path + upload + FileUpload1.FileName); lblInfo.Text = 文件保存成功; else lblInfo.Text = 請(qǐng)指定上傳的文件; ,6. Table控件,HTML提供了Table控件，但是這種Table控件生成的表格多用于顯示靜態(tài)數(shù)據(jù)，表格在使用之前就已經(jīng)定義好了行數(shù)和列數(shù)，不能根

14、據(jù)所要顯示的數(shù)據(jù)動(dòng)態(tài)的調(diào)整表格的行數(shù)和列數(shù)。 服務(wù)器端Table控件也可以創(chuàng)建表格，它可以通過(guò)編程的方式根據(jù)數(shù)據(jù)內(nèi)容動(dòng)態(tài)生成表格或動(dòng)態(tài)調(diào)整表格的行數(shù)和列數(shù)。 動(dòng)態(tài)表格的生成除了需要使用Table控件外，還需要使用TableRow控件和TableCell控件。Table控件代表整個(gè)表格，TableRow控件代表表格中的行，TableCell控件代表每一行中的單元格。,Table控件案例腳本,protected void btnSubmit_Click(object sender, EventArgs e) /獲得表格的行數(shù)賦給變量rows int rows = int.Parse(txtRow.

15、Text); /獲得表格的列數(shù)賦給變量cells int cells = int.Parse(txtCell.Text); int count = 0; for (int i = 0; i rows; i+) /創(chuàng)建表格的一行 TableRow r = new TableRow(); for (int j = 0; j cells; j+) /創(chuàng)建一個(gè)單元格 TableCell c = new TableCell(); count+; /將count的值轉(zhuǎn)換為字符串在單元格中顯示出來(lái) c.Controls.Add(new LiteralControl(count.ToString(); /將單

16、元格插入對(duì)應(yīng)的行中 r.Cells.Add(c); /將行插入表格中 tableInfo.Rows.Add(r); ,7. Panel控件和PlaceHolder控件,ASP.NET提供兩種容器控件Panel控件和PlaceHolder控件。 Panel控件可以將放入其中的一組控件作為一個(gè)整體來(lái)操作。 案例演示 PlaceHolder控件用于在頁(yè)面上保留一個(gè)位置，以便運(yùn)行時(shí)在該位置動(dòng)態(tài)放置其他的控件。 實(shí)例演示,Panel控件案例腳本,protected void radlistLanguage_SelectedIndexChanged(object sender, EventArgs e) if (radlistLanguage.SelectedItem.Text = 其他語(yǔ)種) Panel1.Visible = true; else Panel1.Visible = false; ,PlaceHolder控件案例腳本,protected void Page_Load(object sender, EventArgs e) Label lblTitle = new Label(); lblT