應(yīng)用驗(yàn)證控件講義

1、項(xiàng)目四應(yīng)用驗(yàn)證控件項(xiàng)目四應(yīng)用驗(yàn)證控件 任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì) 任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【任務(wù)要點(diǎn)】【任務(wù)要點(diǎn)】常用驗(yàn)證服務(wù)器控件的使用常用驗(yàn)證服務(wù)器控件的使用【案例【案例1】制作提交內(nèi)容必填的注冊(cè)頁(yè)面】制作提交內(nèi)容必填的注冊(cè)頁(yè)面 某網(wǎng)頁(yè)要求學(xué)生提交學(xué)號(hào)和專(zhuān)業(yè)，要求兩項(xiàng)內(nèi)容必填。若用某網(wǎng)頁(yè)要求學(xué)生提交學(xué)號(hào)和專(zhuān)業(yè)，要求兩項(xiàng)內(nèi)容必填。若用戶沒(méi)有在文本框中輸入學(xué)號(hào)或沒(méi)有通過(guò)下拉列表框選擇專(zhuān)業(yè)，則戶沒(méi)有在文本框中輸入學(xué)號(hào)或沒(méi)有通過(guò)下拉列表框選擇專(zhuān)業(yè)，則顯示出錯(cuò)提示，顯示顯示出錯(cuò)提示，顯示圖圖4-1所示的所示的Web頁(yè)面，程序正常運(yùn)行時(shí)顯示頁(yè)面，程序正常運(yùn)

2、行時(shí)顯示圖圖4-2所示的結(jié)果。所示的結(jié)果。下一頁(yè)返回任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【具體步驟】【具體步驟】1.設(shè)計(jì)設(shè)計(jì)Web頁(yè)面頁(yè)面 新建一個(gè)新建一個(gè)ASP.NET網(wǎng)站，向頁(yè)面中添加必要的控件說(shuō)明文字，網(wǎng)站，向頁(yè)面中添加必要的控件說(shuō)明文字，添加一個(gè)按鈕控件添加一個(gè)按鈕控件Button1；一個(gè)文本框控件；一個(gè)文本框控件TextBox1；一個(gè)下拉；一個(gè)下拉列表框控件列表框控件DropDownList1和兩個(gè)必須項(xiàng)驗(yàn)證控件和兩個(gè)必須項(xiàng)驗(yàn)證控件RequiredFieldValidator1、RequiredFieldValidator2，注意將驗(yàn)證，注意將驗(yàn)證控件放置在被驗(yàn)證控件的右

3、側(cè)。控件放置在被驗(yàn)證控件的右側(cè)。2.設(shè)置對(duì)象屬性設(shè)置對(duì)象屬性 Web頁(yè)面中各控件的初始屬性設(shè)置，見(jiàn)頁(yè)面中各控件的初始屬性設(shè)置，見(jiàn)表表4-1。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)Web頁(yè)面加載時(shí)執(zhí)行的事件過(guò)程代碼如下：頁(yè)面加載時(shí)執(zhí)行的事件過(guò)程代碼如下：protected void Page_Load(object sender,EventArgs e)dropSpec.Items.Add(-請(qǐng)選擇專(zhuān)業(yè)請(qǐng)選擇專(zhuān)業(yè)-);/填充專(zhuān)業(yè)下拉列表框中的選填充專(zhuān)業(yè)下拉列表框中的選項(xiàng)項(xiàng)dropSpec.Items.Add(網(wǎng)絡(luò)技術(shù)網(wǎng)絡(luò)技術(shù));dropSpec.Items.Add(軟件

4、工程軟件工程);dropSpec.Items.Add(多媒體應(yīng)用多媒體應(yīng)用);dropSpec.Items.Add(計(jì)算機(jī)維修計(jì)算機(jī)維修);this.Title=必須項(xiàng)驗(yàn)證控件應(yīng)用示例必須項(xiàng)驗(yàn)證控件應(yīng)用示例;/設(shè)置頁(yè)面標(biāo)題設(shè)置頁(yè)面標(biāo)題下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)單擊【提交】按鈕時(shí)執(zhí)行的事件過(guò)程代碼如下：?jiǎn)螕簟咎峤弧堪粹o時(shí)執(zhí)行的事件過(guò)程代碼如下：protected void btnOK_Click(object sender,EventArgs e)/將用戶的選擇顯示到標(biāo)簽控件中將用戶的選擇顯示到標(biāo)簽控件中 lblResult.Text=你的學(xué)號(hào)是：你的學(xué)號(hào)是

5、：+txtNum.Text+你的專(zhuān)你的專(zhuān)業(yè)是：業(yè)是：+dropSpec.Text;下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【案例【案例2】利用比較驗(yàn)證控件來(lái)制作注冊(cè)頁(yè)面】利用比較驗(yàn)證控件來(lái)制作注冊(cè)頁(yè)面 設(shè)計(jì)一個(gè)模擬的用戶注冊(cè)頁(yè)面，要求使用比較驗(yàn)證控件設(shè)計(jì)一個(gè)模擬的用戶注冊(cè)頁(yè)面，要求使用比較驗(yàn)證控件（CompareValidator）對(duì)用戶輸入密碼和確認(rèn)密碼的一致性、日）對(duì)用戶輸入密碼和確認(rèn)密碼的一致性、日期數(shù)據(jù)格式的正確性進(jìn)行比較驗(yàn)證，使用必須項(xiàng)驗(yàn)證控件期數(shù)據(jù)格式的正確性進(jìn)行比較驗(yàn)證，使用必須項(xiàng)驗(yàn)證控件（RequiredFieldValidator）設(shè)置用戶名及密碼為必

6、填字段。程序）設(shè)置用戶名及密碼為必填字段。程序運(yùn)行結(jié)果如運(yùn)行結(jié)果如圖圖4-3和和圖圖4-4所示。所示。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【具體步驟】【具體步驟】1.設(shè)計(jì)設(shè)計(jì)Web頁(yè)面頁(yè)面 新建一個(gè)新建一個(gè)ASP.NET網(wǎng)站，切換到設(shè)計(jì)視圖。向由系統(tǒng)自動(dòng)創(chuàng)網(wǎng)站，切換到設(shè)計(jì)視圖。向由系統(tǒng)自動(dòng)創(chuàng)建的建的Default.aspx頁(yè)面中添加一個(gè)用于布局的頁(yè)面中添加一個(gè)用于布局的HTML表格，適當(dāng)調(diào)表格，適當(dāng)調(diào)整表格的行列數(shù)；向表格中添加必要的控件說(shuō)明文字；添加四個(gè)整表格的行列數(shù)；向表格中添加必要的控件說(shuō)明文字；添加四個(gè)用于接收用戶輸入數(shù)據(jù)的文本框用于接收用戶輸入數(shù)據(jù)的文本框

7、TextBox1TextBox4；兩個(gè)按鈕；兩個(gè)按鈕控件控件Button1、Button2；一個(gè)用于顯示通過(guò)驗(yàn)證信息的標(biāo)簽控件；一個(gè)用于顯示通過(guò)驗(yàn)證信息的標(biāo)簽控件Label1；添加兩個(gè)必須項(xiàng)驗(yàn)證控件；添加兩個(gè)必須項(xiàng)驗(yàn)證控件RequiredFieldValidator1和和RequiredFieldValidator2，兩個(gè)比較驗(yàn)證控件，兩個(gè)比較驗(yàn)證控件CompareValidator1、CompareValidator2，注意將必須項(xiàng)驗(yàn)證控件分別放置在用戶名欄，注意將必須項(xiàng)驗(yàn)證控件分別放置在用戶名欄和密碼欄的右側(cè)單元格，將比較驗(yàn)證控件分別放置在確認(rèn)密碼和和密碼欄的右側(cè)單元格，將比較驗(yàn)證控件分別

8、放置在確認(rèn)密碼和出生日期欄的右側(cè)單元格；適當(dāng)調(diào)整各控件的大小及位置。出生日期欄的右側(cè)單元格；適當(dāng)調(diào)整各控件的大小及位置。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)2.設(shè)置對(duì)象屬性設(shè)置對(duì)象屬性 各控件的初始屬性設(shè)置見(jiàn)各控件的初始屬性設(shè)置見(jiàn)表表4-2。3.編寫(xiě)事件代碼編寫(xiě)事件代碼protected void Page_Load(object sender,EventArgs e) this.Title=CompareValidator控件應(yīng)用示例控件應(yīng)用示例; txtUsername.Focus();/頁(yè)面加載時(shí)，用戶名文本框得到焦點(diǎn)頁(yè)面加載時(shí)，用戶名文本框得到焦點(diǎn) lblP

9、ass.Text=;/清除通過(guò)驗(yàn)證標(biāo)簽中的文本清除通過(guò)驗(yàn)證標(biāo)簽中的文本 protected void btnOK_Click(object sender,EventArgs e) lblPass.Text=本頁(yè)已通過(guò)驗(yàn)證！本頁(yè)已通過(guò)驗(yàn)證！;/通過(guò)驗(yàn)證后在標(biāo)簽中顯示的信通過(guò)驗(yàn)證后在標(biāo)簽中顯示的信息息下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【案例【案例3】利用范圍驗(yàn)證控件來(lái)制作數(shù)值錄入頁(yè)】利用范圍驗(yàn)證控件來(lái)制作數(shù)值錄入頁(yè)面面 使用使用RangeValidator控件驗(yàn)證用戶輸入學(xué)生成績(jī)的數(shù)值范圍，控件驗(yàn)證用戶輸入學(xué)生成績(jī)的數(shù)值范圍，用戶輸入數(shù)據(jù)被驗(yàn)證通過(guò)時(shí)頁(yè)面中顯示如用戶輸

10、入數(shù)據(jù)被驗(yàn)證通過(guò)時(shí)頁(yè)面中顯示如圖圖4-5所示的結(jié)果。若用所示的結(jié)果。若用戶沒(méi)有輸入學(xué)號(hào)或輸入了不合邏輯的成績(jī)值，則顯示如戶沒(méi)有輸入學(xué)號(hào)或輸入了不合邏輯的成績(jī)值，則顯示如圖圖4-6所示所示的出錯(cuò)提示信息。的出錯(cuò)提示信息。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【具體步驟】【具體步驟】1.設(shè)計(jì)設(shè)計(jì)Web頁(yè)面頁(yè)面 新建一個(gè)新建一個(gè)ASP.NET網(wǎng)站，如網(wǎng)站，如圖圖4-7所示，向頁(yè)面中添加必要的所示，向頁(yè)面中添加必要的控件說(shuō)明文字，兩個(gè)文本框控件控件說(shuō)明文字，兩個(gè)文本框控件TextBox1、TextBox2；一個(gè)按鈕；一個(gè)按鈕控件控件Button1。在用于輸入學(xué)生學(xué)號(hào)的文本框后

11、面添加一個(gè)必須項(xiàng)。在用于輸入學(xué)生學(xué)號(hào)的文本框后面添加一個(gè)必須項(xiàng)驗(yàn)證控件驗(yàn)證控件RequiredFieldValidator1，在用于輸入學(xué)生成績(jī)的文本框，在用于輸入學(xué)生成績(jī)的文本框后面添加一個(gè)范圍驗(yàn)證控件后面添加一個(gè)范圍驗(yàn)證控件RangeValidator1。2.設(shè)置對(duì)象屬性設(shè)置對(duì)象屬性 各控件的初始屬性設(shè)置見(jiàn)各控件的初始屬性設(shè)置見(jiàn)表表4-3。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)3.編寫(xiě)事件代碼編寫(xiě)事件代碼頁(yè)面裝入時(shí)執(zhí)行的事件過(guò)程代碼如下：頁(yè)面裝入時(shí)執(zhí)行的事件過(guò)程代碼如下：protected void Page_Load(object sender,EventArg

12、s e) this.Title=范圍驗(yàn)證控件應(yīng)用示例范圍驗(yàn)證控件應(yīng)用示例; txtNum.Focus(); lblMsg.Text=;下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)單擊【提交】按鈕時(shí)執(zhí)行的事件代碼如下：?jiǎn)螕簟咎峤弧堪粹o時(shí)執(zhí)行的事件代碼如下：protected void btnOK_Click(object sender,EventArgs e) lblMsg.Text=姓名：姓名：+txtNum.Text+    +成績(jī)：成績(jī)：+ txtScore.Text;下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)

13、計(jì)【案例【案例4】 制作用戶不能含有漢字、密碼為制作用戶不能含有漢字、密碼為612位及對(duì)郵箱格式進(jìn)行驗(yàn)位及對(duì)郵箱格式進(jìn)行驗(yàn)證的注冊(cè)頁(yè)面。證的注冊(cè)頁(yè)面?！揪唧w步驟】【具體步驟】 1.設(shè)計(jì)設(shè)計(jì)Web頁(yè)面頁(yè)面 新建一個(gè)新建一個(gè)ASP.NET網(wǎng)站，向由系統(tǒng)自動(dòng)產(chǎn)生的默認(rèn)頁(yè)面中添網(wǎng)站，向由系統(tǒng)自動(dòng)產(chǎn)生的默認(rèn)頁(yè)面中添加一個(gè)加一個(gè)HTML表格，參照表格，參照?qǐng)D圖4-11適當(dāng)調(diào)整適當(dāng)調(diào)整HTML表格的行列數(shù)及表格的行列數(shù)及行高、列寬。向行高、列寬。向HTML表格中添加需要的控件說(shuō)明文字，向頁(yè)面表格中添加需要的控件說(shuō)明文字，向頁(yè)面中添加三個(gè)文本框控件中添加三個(gè)文本框控件TextBox1TextBox3；添加一個(gè)

14、按鈕控件；添加一個(gè)按鈕控件Button1和一個(gè)用于輸出驗(yàn)證是否通過(guò)信息的標(biāo)簽控件和一個(gè)用于輸出驗(yàn)證是否通過(guò)信息的標(biāo)簽控件Label1；分；分別在用戶名文本框和密碼文本框的右側(cè)各添加一個(gè)自定義驗(yàn)證別在用戶名文本框和密碼文本框的右側(cè)各添加一個(gè)自定義驗(yàn)證下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì) 控件控件CustomValidator1、CustomValidator2；在電子郵件文本框右；在電子郵件文本框右側(cè)添加一個(gè)正則表達(dá)式驗(yàn)證控件側(cè)添加一個(gè)正則表達(dá)式驗(yàn)證控件RegularExpressionValidator1；適；適當(dāng)調(diào)整各控件的大小和位置。當(dāng)調(diào)整各控件的大小和位置。2

15、.設(shè)置對(duì)象屬性設(shè)置對(duì)象屬性各控件的初始屬性設(shè)置見(jiàn)表各控件的初始屬性設(shè)置見(jiàn)表4-4。3.編寫(xiě)事件代碼編寫(xiě)事件代碼下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)【背景知識(shí)】【背景知識(shí)】 數(shù)據(jù)驗(yàn)證機(jī)制介紹數(shù)據(jù)驗(yàn)證機(jī)制介紹 數(shù)據(jù)驗(yàn)證服務(wù)器控件可以提供易用但功能強(qiáng)大的方法檢查輸數(shù)據(jù)驗(yàn)證服務(wù)器控件可以提供易用但功能強(qiáng)大的方法檢查輸入窗體中的錯(cuò)誤，并在必要時(shí)向用戶顯示消息。入窗體中的錯(cuò)誤，并在必要時(shí)向用戶顯示消息。 驗(yàn)證控件像其他服務(wù)器控件一樣添加到驗(yàn)證控件像其他服務(wù)器控件一樣添加到Web窗體頁(yè)。有不同窗體頁(yè)。有不同的控件用于特定的驗(yàn)證類(lèi)型，如范圍檢查或模式匹配，以及確保的控件用于特定的驗(yàn)

16、證類(lèi)型，如范圍檢查或模式匹配，以及確保用戶不跳過(guò)輸入字段的用戶不跳過(guò)輸入字段的RequiredFieldValidator等?？梢詫⒍鄠€(gè)驗(yàn)等?？梢詫⒍鄠€(gè)驗(yàn)證控件附加到一個(gè)輸入控件。例如，可以既指定需要輸入，又指證控件附加到一個(gè)輸入控件。例如，可以既指定需要輸入，又指定輸入必須包含特定范圍的值。定輸入必須包含特定范圍的值。 表表4-5列出了所有的驗(yàn)證控件。接下來(lái)將分別詳細(xì)介紹這些控列出了所有的驗(yàn)證控件。接下來(lái)將分別詳細(xì)介紹這些控件的使用方法。件的使用方法。下一頁(yè)返回上一頁(yè)任務(wù)一完成注冊(cè)界面的設(shè)計(jì)任務(wù)一完成注冊(cè)界面的設(shè)計(jì) 在處理用戶的輸入時(shí)（如提交窗體時(shí)），在處理用戶的輸入時(shí)（如提交窗體時(shí)），We

17、b窗體頁(yè)框架將窗體頁(yè)框架將用戶的輸入傳遞給關(guān)聯(lián)的驗(yàn)證控件。驗(yàn)證控件測(cè)試用戶的輸入，用戶的輸入傳遞給關(guān)聯(lián)的驗(yàn)證控件。驗(yàn)證控件測(cè)試用戶的輸入，并設(shè)置屬性以指示輸入是否通過(guò)了驗(yàn)證測(cè)試。處理完所有的驗(yàn)證并設(shè)置屬性以指示輸入是否通過(guò)了驗(yàn)證測(cè)試。處理完所有的驗(yàn)證控件后，將設(shè)置頁(yè)上的控件后，將設(shè)置頁(yè)上的IsValid屬性。如果有任何控件顯示驗(yàn)證檢屬性。如果有任何控件顯示驗(yàn)證檢查失敗，則整頁(yè)設(shè)置為無(wú)效。查失敗，則整頁(yè)設(shè)置為無(wú)效。 如果驗(yàn)證控件有錯(cuò)誤，錯(cuò)誤信息可由該驗(yàn)證控件顯示在頁(yè)中，如果驗(yàn)證控件有錯(cuò)誤，錯(cuò)誤信息可由該驗(yàn)證控件顯示在頁(yè)中，或者顯示在頁(yè)上其他地方的或者顯示在頁(yè)上其他地方的ValidationSummary控件中。當(dāng)頁(yè)的控件中。當(dāng)頁(yè)的IsValid屬性為屬性為False時(shí)，顯示時(shí)，顯示ValidationSummary控件。它輪詢(xún)頁(yè)控件。它輪詢(xún)頁(yè)上的每個(gè)驗(yàn)證控件，并聚合每個(gè)控件公開(kāi)的文本消息。可以驗(yàn)證上的每個(gè)驗(yàn)證控件，并聚合每個(gè)控件公開(kāi)的文本消息。可以驗(yàn)證的的Web服務(wù)器控件見(jiàn)服務(wù)器控件見(jiàn)表表4-6。返回上一頁(yè)表表4-1各控件的初始屬性設(shè)置各控件的初始屬性設(shè)置返回返回下一頁(yè)表表4-2各驗(yàn)證控件的初始屬性設(shè)置各驗(yàn)證控件的初始屬性設(shè)置返回上一頁(yè)表表4-3各驗(yàn)證控件的初