第 7 章 web 表單驗證控制項 7-1 表單送回功能( postback ) 7-2...

31
第7第 Web 第第第第第第第 • 7-1 第第第第第第Postback • 7-2 第第第第第第第Viewstate • 7-3 第第第第第第第第第 • 7-4 第第第第第第第第第(一) • 7-5 第第第第第第第第第 第第 () • 7-6 Web 第第第第第第第

Post on 22-Dec-2015

245 views

Category:

Documents


2 download

TRANSCRIPT

第 7 章 Web 表單驗證控制項• 7-1 表單送回功能( Postback)• 7-2 表單的顯示狀態( Viewstate)• 7-3 表單欄位驗證的基礎• 7-4 伺服端的驗證控制項(一)• 7-5 伺服端的驗證控制項(二)• 7-6 Web 表單的重設按鈕

7-1 表單送回功能( Postback)

• 7-1-1 表單的 IsPostBack 屬性• 7-1-2 控制項的 AutoPostBack 屬性

7-1 表單送回功能( Postback)

• ASP.NET 使用 Web 表單的控制項讓使用者輸入或選取資料,使用者輸入的資料在用戶端是以送回功能,將資料送回伺服端進行處理,預設是送到自已的 ASP.NET 程式,相關的屬性,如下所示:– Page 物件的 IsPostBack 屬性:檢查是否是第一次載入 ASP.NET 程式,或是已經在用戶端執行過送回。

– 伺服端控制項的 AutoPostBack 屬性:如果 Web 控制項將 AutoPostBack 屬性設為 True ,當控制項的資料變更時,就會自動執行用戶端送回。

7-1-1 表單的 IsPostBack 屬性• 在 Page_Load 事件處理程序可以使用

IsPostBack 屬性檢查是否已經送回資料,如下所示:If IsPostBack Then

If NameTextBox.Text <> "" Then

showName.Text = nameTextBox.Text & " 您好 !"

End If

Else

NameTextBox.Text = " 江小魚 "

End If

7-1-2 控制項的 AutoPostBack屬性 - 說明

• Web 表單的部分控制項擁有 AutoPostBack屬性,例如: DropDownList 控制項,如下所示:<asp:DropDownList id="Username" Width="100px" AutoPostBack="True" OnSelectedIndexChanged="Change_Name" runat="Server"> <asp:ListItem Text=" 陳會安 " Value="001"/> <asp:ListItem Text=" 江小魚 " Value="002"/> <asp:ListItem Text=" 陳大安 " Value="003"/></asp:DropDownList>

7-1-2 控制項的 AutoPostBack屬性 - 控制項

• AutoPostBack 屬性支援的 Web 控制項和事件,如下表所示:

Web控制項 支援的事件

TextBox OnTextChanged

CheckBox、RadioButton OnCheckChanged

DropDownList 、 CheckBoxList 、ListBox、RadioButtonList

OnSelectedIndexChanged

7-2 表單的顯示狀態( Viewstate)

• 7-2-1 顯示狀態的基礎• 7-2-2 取消顯示狀態• 7-2-3 如何保留 PostBack 表單

送回的其它資料

7-2-1 顯示狀態的基礎 - 說明• 「顯示狀態」( ViewState )屬於一種

ASP.NET 機制,能夠保留伺服端控制項的狀態,也就是儲存的值,例如:在 Web 表單擁有一個TextBox 控制項,一旦輸入值,不論送回( Postback )多少次,除非更改 TextBox 控制項的值,否則顯示狀態都能夠自動保留其值。– HTML 表單沒有顯示狀態功能– Web 表單擁有顯示狀態功能

7-2-1 顯示狀態的基礎 - 原理• 顯示狀態看起來是很神奇,事實上,它是使用

隱藏欄位儲存狀態資料,如下所示:<form name="_ctl0" method="post" action="Ch7-2ViewState.aspx" id="_ctl0"><input type="hidden" name="__VIEWSTATE"

value="dDwxMzUyNjI4MTk0O3Q8O2w8aTw0Pjs+O2w8dDxwPHA8bDxUZXh0Oz47bDzpmbPmnIPlrokgOiDpu4M7Pj47Pjs7Pjs+Pjs+lBXbCdvGY+vrY6YS6xJXo3K5uzU=" />

姓名 : <input name="Name" type="text" value=" 陳會安 " id="Name" /><br>

選擇色彩 : ………..<input type="submit" name="Send" value=" 送出 " id="Send" /></form>

7-2-2 取消顯示狀態• 在 ASP.NET 程式預設使用顯示狀態儲存控制

項的內容,取消整個 ASP.NET 顯示狀態,如下所示:<%@ Page Language="VB" EnableViewState="False" %>

• 上述 Page 指引的 EnableViewState 屬性為False ,表示取消顯示狀態, True 為啟動顯示狀態。如果只有指定控制項需要取消顯示狀態,如下所示:<asp:Label id="Label1" EnableViewState="False"

runat="Server" />

7-2-3 如何保留 PostBack 表單送回的其它資料

• ASP.NET 提供多種方法可以用來保留這些變數或參數值,如下所示:– 使用 Cookie 保留變數值。– 使用 Session 變數保留變數值。– 使用 HtmlInputHidden 控制項保留變數值。– 使用顯示狀態的 StateBag 物件保留變數值。

7-3 表單欄位驗證的基礎• 7-3-1 表單欄位驗證的種類• 7-3-2 ASP.NET 的伺服端驗證控制項

7-3-1 表單欄位驗證的種類• 表單欄位的驗證以把關的位置來區分,

可以分為兩種,如下所示:– 客戶端表單欄位驗證:這是指在尚未送到伺

服端前,在客戶端的瀏覽程式進行檢查,即使用 JavaScript或 VBScript 程式碼執行欄位值的檢查。

– 伺服端表單欄位驗證:伺服端的表單欄位驗證是在資料送到伺服端後,才進行資料的檢查。

7-3-2 ASP.NET 的伺服端驗證控制項 - 種類

驗證控制項 說明

RequiredFiledValidator 使用者一定需要輸入資料或選取選項,不能跳過此欄位

不輸入,例如:不可以不輸入使用者名稱

CompareValidator 將使用者輸入控制項的值,與常數或其它控制項值進行

比較,例如:兩次輸入的密碼是否相同

RangeValidator 使用者輸入控制項的值是一個範圍,需要在一定範圍才

符合規則,例如:年齡需要大於 20,小於 80

RegularExpressionValidator 使用「正規語言」(Regular Express)的範本字串檢查

輸入的資料,例如:身份證字號或電子郵件地址欄位

CustomValidator 自行撰寫程序檢查欄位值

ValidationSummary 顯示Web表單所有驗證控制項錯誤訊息的摘要資訊

7-3-2 ASP.NET 的伺服端驗證控制項 - 使用

• 如果 Web 表單擁有上表的驗證控制項,就可以檢查 Page 物件的 IsValid 屬性,以確認表單是否已經通過驗證,如下所示:If Page.IsValid Then

Lname.Text = " 姓名 : " & name.Text

Lpass.Text = " 密碼 : " & pass.Text

End If

7-4 伺服端的驗證控制項(一)

• 7-4-1 RequiredFiledValidator 驗證控制項• 7-4-2 CompareValidator 驗證控制項• 7-4-3 RangeValidator 驗證控制項

7-4-1 RequiredFiledValidator 驗證控制項

• RequiredFiledValidator 驗證控制項可以檢查指定控制項是否沒有輸入資料或選取選項,如下所示:<asp:RequiredFieldValidator id="validName"

ControlToValidate="name"

ErrorMessage=" 請輸入使用者姓名 !"

runat="Server"/>

7-4-2 CompareValidator 驗證控制項

• CompareValidator 驗證控制項可以用來比較兩個控制項的值,或是和一個指定的常數值進行比較,如下所示:<asp:CompareValidator id="validComp"

ControlToValidate="pass" ControlToCompare = "pass1"

Type="String" Display="Dynamic"

ErrorMessage=" 輸入的密碼不相同 !"

runat="Server"/>

7-4-3 RangeValidator 驗證控制項

• RangeValidator 驗證控制項可以用來檢查控制項的值,是否在一個指定的範圍,如下所示:<asp:RangeValidator id="validRange"

ControlToValidate="age" Display="Dynamic"

Type="Integer"

MinimumValue="21" MaximumValue="80"

ErrorMessage=" 年齡的範圍是 21 ~ 80!"

runat="server"/>

7-5 伺服端的驗證控制項(二)

• 7-5-1 正規語言的基礎• 7-5-2 RegularExpressionValidator

驗證控制項• 7-5-3 CustomValidator 驗證控制項• 7-5-4 ValidationSummary 驗證控制

7-5-1 正規語言的基礎 - 說明• 「正規語言」( Regular Expression )是一個範

本字串,能夠進行字串的比對和取代,例如:檢查使用者名稱、身份証字號等字串格式是否符合需求。

• 在正規語言的範本字串中,每一個字元都有特殊意義,屬於一種小型語言,正規語言解譯程式或稱引擎能夠將定義的正規語言和字串變數進行比較,解譯程式傳回布林值, True 表示字串符合範本字串的定義, False 表示不符合。

7-5-1 正規語言的基礎 - 字元與字元集

字元集 說明

[abc] 英文字母 a、b或 c

[abc\{] 英文字母 a、b、c或符號{

[a-z] 任何英文的小寫字母

[A-Z] 任何英文的大寫字母

[0-9] 數字 0~9

[a-zA-Z] 任何大小寫的英文字母

[^abc] 除了 a、b和 c以外的任何字元

7-5-1 正規語言的基礎 - 語法 1

• 正規語言的範本字串是一個字串,只是字串擁有前述的字元符號和之後特殊的比較字元。首先需要定義範本字串在比對字串出現的位置,如下表所示:

字元 說明

^ 比對字串的開始

$ 比對字串的結束

7-5-1 正規語言的基礎 - 語法 2

• 正規語言不只可以定義字串出現的位置,還可以定義各字元出現的次數,如下表所示:字元 說明

? 0或 1次

* 0或很多次

+ 1或很多次

{n} 出現 n次

{n,m} 出現 n到 m次

{n,} 至少出現 n次

7-5-1 正規語言的基礎 - 使用• ASP.NET 預設匯入 System.Text.RegularExpressions

的名稱空間,我們可以直接使用 Regex 建構子,建立正規語言的物件,如下所示:Dim regExp As Regex = New Regex("[A-Z]{1}[0-9]{9}")Dim regExp1 As Regex = New Regex("[0-9]{1}[\w]*", _ RegexOptions.IgnoreCase)

• 在建立好 Regex 物件後,可以使用 isMatch 方法比對參數的字串是否符合範本字串,如下所示:If regExp.IsMatch(code.Text) Then

…………..

End If

7-5-2 RegularExpressionValidator 驗

證控制項• RegularExpressionValidator 驗證控制項是

使用正規語言的範本字串比對控制項的值,如下所示:<asp:RegularExpressionValidator id="ValidRegxEmail"

ControlToValidate="email" Display="Static" ValidationExpression="[\w\.]+@[\w\.]+\.(com|net|org|edu|mil)[\w\.]*"

ErrorMessage=" 電子郵件地址的格式錯誤 "

runat="Server"/>

7-5-3 CustomValidator 驗證控制項

• CurstomValidator 驗證控制項可以建立伺服端或客戶端欄位驗證功能,我們可以自行撰寫程序來驗證控制項的值,如下所示:<asp:CustomValidator id="validCustom"

ControlToValidate="code" Display="Dynamic"

OnServerValidate="Check_Code"

ErrorMessage=" 身份証字號驗證錯誤 !"

runat="Server"/>

7-5-4 ValidationSummary 驗證控制項

• ValidationSummary 驗證控制項是用來顯示驗證錯誤的摘要資訊,也就是將所有驗證錯誤訊息以摘要方式顯示,如下所示:<asp:ValidationSummary ID="validSummary"

HeaderText="Web 表單欄位的錯誤資料 : "

DisplayMode="BulletList"

runat="Server"/>

7-6 Web 表單的重設按鈕• 7-6-1 取消客戶端驗證控制項的功能• 7-6-2 取消伺服端驗證控制項的功能

7-6-1 取消客戶端驗證控制項的功能

• 取消客戶端驗證功能改為伺服端驗證,使用的是Page 指引的 ClientTarget 屬性,如下所示:<%@ Page ClientTarget="DownLevel"%>

• 上述 Page 指引的 ClientTarget 屬性可以指定瀏覽程式的版本,其值如下所示:– UpLevel :這是指客戶端瀏覽程式使用 Internet

Explorer 5.5 或以上的版本。– DownLevel :這是指客戶端瀏覽程式使用 Internet

Explorer 5.5 以下的版本,或非 Internet Explorer瀏覽程式。

7-6-2 取消伺服端驗證控制項的功能

• 暫時取消伺服端控制項的功能,如下所示:validComp.IsValid = TruevalidName.IsValid = TruevalidPass.IsValid = True

• 上述程式碼將驗證控制項的 IsValid 屬性設為 True表示通過驗證,如此可以騙過 Page.IsValid 屬性,而不會顯示出驗證錯誤的訊息。

• 永遠取消伺服端驗證控制項的功能,只需將 Web控制項的 Enable 屬性設為 False ,如下:validComp.Enabled = False