Bài 3:
Kiểm tra tính hợp lệ của dữ liệu &
Quản lý trạng thái
Các nội dung đã học trong bài trước:
Điều khiển
Làm việc với điều khiển Web Server
Hệ thống bài cũ
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
2
Mục tiêu bài học
1. Kiểm tra tính hợp lệ của dữ liệu
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
3
2. Quản lý trạng thái
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
4
Điều khiển Validation
Dữ liệu nhập vào Web Form
luôn phải thỏa mãn một
điều kiện ràng buộc.
Điều khiển Validation
cung cấp cách thức để
kiểm tra tính hợp lệ của
dữ liệu nhập trên Web
Form.
Điều khiển Validation
RequiredFieldValidator
CompareValidator
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
5
Dữ liệu nhập vào Web Form
luôn phải thỏa mãn một
điều kiện ràng buộc.
Điều khiển Validation
cung cấp cách thức để
kiểm tra tính hợp lệ của
dữ liệu nhập trên Web
Form.
RangeValidator
RegularExpressionValidator
CustomValidator
ValidationSummary
RequiredFieldValidator
Các loại điều khiển Validation &
Trường hợp sử dụng
Điều khiển
Trường hợp sử dụng
RequiredFieldValidator
- Với các điều khiển yêu cầu nhập liệu
CompareValidator
- So sánh giá trị được nhập vào điều
khiển với: Một hằng số hoặc Giá trị của
một điều khiển khác
- Kiểm tra kiểu dữ liệu được nhập vào
điều khiển
RangeValidator
- Bắt buộc giá trị nhập vào điều khiển
phải thỏa mãn một khoảng cho trước
Validator
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
6
RangeValidator
- Bắt buộc giá trị nhập vào điều khiển
phải thỏa mãn một khoảng cho trước
RegularExpressionValidator
- Bắt buộc giá trị nhập vào phải so khớp
với một biểu thức được chỉ định sẵn
CustomValidator
- Bắt buộc giá trị nhập vào phải thỏa
mãn mã kiểm tra tính hợp lệ tự định
nghĩa
ValidationSummary
- Tổng kết tất cả các lỗi của tất cả các
Validator trên trang
Kiểm tra tính hợp lệ của một điều khiển bằng cách nào?
Liên kết điều khiển đó với một điều khiển Validation
Kiểm tra tính hợp lệ
của một điều khiển như thế nào?
Điều khiển nhập
liệu
Điều khiển
Validation
1 0…n
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
7
- Mỗi điều khiển Validation chỉ kiểm chứng dữ liệu của
một điều khiển nhập liệu
- Một điều khiển nhập liệu có thể liên kết với nhiều điều
khiển Validation
Thuộc tính
Mô tả
ControlToValidate
ID của điều khiển nhập liệu được kiểm tra hợp lệ
Display
Cách hiển thị thông báo lỗi. Có 3 giá trị (Static, Dynamic, None)
- Nếu sử dụng nhiều Validator cho một điều khiển. Gán giá trị
Dynamic cho thuộc tính này
ErrorMessage/Text
- Giá trị thuộc tính Text sẽ hiển thị trên Validator, giá trị thuộc tính
ErrorMessage sẽ hiển thị trên điều khiển ValidationSumary.
- Nếu thuộc tính Text không được thiết lập giá trị. Cả Validator và
điều khiển ValidationSumary đều hiển thị giá trị của ErrorMessage.
Các thuộc tính cơ bản của Validator
- Giá trị thuộc tính Text sẽ hiển thị trên Validator, giá trị thuộc tính
ErrorMessage sẽ hiển thị trên điều khiển ValidationSumary.
- Nếu thuộc tính Text không được thiết lập giá trị. Cả Validator và
điều khiển ValidationSumary đều hiển thị giá trị của ErrorMessage.
Enabled
Kích hoạt/ vô hiệu điều khiển Validation
EnableClientScript
Kích hoạt/ vô hiệu kiểm tra hợp lệ ở Client
ValidationGroup
Gom nhóm các Validator
SetFocusOnError
Thiết lập Focus cho điều khiển khi dữ liệu nhập vào không hợp lệ
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
8
Nội dung demo
Demo cách liên kết điều khiển RequiredFieldValidator &
điều khiển CompareValidatior cho các điều khiển nhập liệu
Thiết lập giá trị cho các thuộc tính thường dùng
Định dạng màu cho điều khiển Validation
Demo
Kiểm tra tính hợp lệ của dữ liệu
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
9
<asp:RequiredFieldValidator ID="valReqCfmPassword" runat="server"
ControlToValidate="txtCfmPassword"
ErrorMessage="Confirm PassWord is Required"
ForeColor="#FF3300" Display="Dynamic">
</asp:RequiredFieldValidator>
Quá trình ASP.NET
kiểm tra tính hợp lệ của dữ liệu
Người dùng nhập
liệu
Hiển thị thông
báo lỗi
Người dùng nhập
liệu
Hiển thị thông báo lỗi
Trình duyệt hỗ trợ DHTML, dữ liệu
được kiểm chứng tại Client
Trình duyệt không hỗ trợ DHTML,
dữ liệu được kiểm chứng tại Server
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
10
Người dùng Click
vào button
Client kiểm
tra dữ liệu
Không hợp lệ
Hợp lệ
Dữ liệu chuyển tới
Server để xử lý tiếp
Người dùng nhập
liệu
Người dùng Click
vào button
Server kiểm tra dữ
liệu sau quá trình
khởi tạo trang
Không hợp lệ
Hợp lệ
Dữ liệu chuyển tới
Server để xử lý tiếp
Sử dụng với các điều khiển bắt buộc người dùng nhập
liệu
Các điều khiển có thể sử dụng Required Field Validator
TextBox, drop-down List, ListBox, Radio button List, Check
box list
Thuộc tính quan trọng: InitialValue
Gán bằng giá trị mặc định (được thiết lập ở thuộc tính
Text) của điều khiển được kiểm tra
Nếu giá trị này không được người dùng thay đổi, Validation
thất bại
Required Field Validator
Sử dụng với các điều khiển bắt buộc người dùng nhập
liệu
Các điều khiển có thể sử dụng Required Field Validator
TextBox, drop-down List, ListBox, Radio button List, Check
box list
Thuộc tính quan trọng: InitialValue
Gán bằng giá trị mặc định (được thiết lập ở thuộc tính
Text) của điều khiển được kiểm tra
Nếu giá trị này không được người dùng thay đổi, Validation
thất bại
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
11
Nội dung demo
Bắt buộc người dùng nhập liệu trên Text box Name
Bắt buộc người dùng sửa giá trị mặc định trên Text box
Birth date
Bắt buộc người dùng chọn một giá trị trên List box
Demo
Sử dụng Required Field Validator
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
12
Giao diện trang lúc ban đầu Các thông báo lỗi được hiển thị khi người
dùng không nhập liệu vào text box Name và
không thay đổi giá trị mặc định của text box
BirthDate & List box Credit Card
Thực hiện:
Thêm Required Validator cho hai text box & List box
Gán giá trị cho thuộc tính InitialValue cho hai Validator của
text box Birth date & List box credit Card bằng giá trị mặc
định của text box và List box này
Demo
Sử dụng Required Field Validator
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
13
<asp:RequiredFieldValidator ID="valCreditCard" runat="server"
ControlToValidate="lstCreditCard“ ErrorMessage="You must select a credit card type"
ForeColor="#FF3300“ InitialValue="0“ >
</asp:RequiredFieldValidator>
Sử dụng khi nào???
So sánh giá trị điều khiển nhập liệu với hằng số hoặc giá
trị của một điều khiển khác
Kiểm tra kiểu dữ liệu nhập vào điều khiển nhập liệu
Compare Validator
Sử dụng khi nào???
So sánh giá trị điều khiển nhập liệu với hằng số hoặc giá
trị của một điều khiển khác
Kiểm tra kiểu dữ liệu nhập vào điều khiển nhập liệu
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
14
Thuộc tính của riêng điều khiển Compare
Validator
Compare Validator
Thuộc tính
Mô tả
ValueToCompare
Giá trị sử dụng để so sánh với điều khiển
Operator
Loại so sánh
(Equal, GreaterThan…DatatypeCheck)
Type
- Kiểu dữ liệu sử dụng để so sánh
(String, Iteger…)
- Chỉ sử dụng thuộc tính này khi thuộc tính Operator = DattatypeCheck
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
15
Type
- Kiểu dữ liệu sử dụng để so sánh
(String, Iteger…)
- Chỉ sử dụng thuộc tính này khi thuộc tính Operator = DattatypeCheck
ControlToCompare
ID của điều khiển sử dụng để so sánh
Sử dụng thuộc tính như thế nào???
So sánh với hằng số: Sử dụng thuộc tính ValueToCompare + Operator +
Type
So sánh với điều khiển khác: Thuộc tính ControlToCompare + Operator +
Type
Kiểm tra kiểu dữ liệu: Thuộc tính Operator (=DataCheckType) + Type
Nội dung demo:
Bắt buộc dữ liệu trên text box Quantity phải là một số
nguyên lớn hơn hoặc bằng 0
Bắt buộc Text box End Date phải là ngày lớn hơn Start
Date
Demo
Sử dụng Compare Validator
Nội dung demo:
Bắt buộc dữ liệu trên text box Quantity phải là một số
nguyên lớn hơn hoặc bằng 0
Bắt buộc Text box End Date phải là ngày lớn hơn Start
Date
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
16
Thực hiện
Tạo ba điều khiển Compare Validator
Điều khiển thứ nhất: So sánh Quantity với giá trị 0
Điều khiển thứ hai: Kiểm tra kiểu dữ liệu của trường Quantity
là Integer
Điều khiển thứ ba: So sánh End Date với Start Date
Demo
Sử dụng Compare Validator
Thực hiện
Tạo ba điều khiển Compare Validator
Điều khiển thứ nhất: So sánh Quantity với giá trị 0
Điều khiển thứ hai: Kiểm tra kiểu dữ liệu của trường Quantity
là Integer
Điều khiển thứ ba: So sánh End Date với Start Date
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
17
Chú ý khi sử dụng Compare Validator
Phải sử dụng kết hợp với điều khiển Required Field Validator
Sử dụng khi nào???
Kiểm tra xem giá trị do người dùng nhập vào có nằm trong
khoảng được chỉ định
Thuộc tính riêng của điều khiển Range Validator
Range Validator
Thuộc tính
Mô tả
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
18
Thuộc tính
Mô tả
MinimumValue
Giá trị nhỏ nhất mà điều khiển được phép nhập
MaximumValue
Giá trị lớn nhất mà điều khiển được phép nhập
Type
Kiểu dữ liệu sử dụng để so sánh (String, Integer, Date…)
Range Validator
Ví dụ sử dụng Range Validator để kiểm tra điều khiển thỏa mãn dải
giá trị số
<asp:TextBox ID="txtDays“ runat="server"> </asp:TextBox>
<asp:RangeValidator ID="RangeValidator1" runat="server“ ControlToValidate="txtDays"
Type="Integer“ MinimumValue="1" MaximumValue="14“ ErrorMessage="Days
must be between 1 and 14.">
</asp:RangeValidator>
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
19
<asp:TextBox ID="txtDays“ runat="server"> </asp:TextBox>
<asp:RangeValidator ID="RangeValidator1" runat="server“ ControlToValidate="txtDays"
Type="Integer“ MinimumValue="1" MaximumValue="14“ ErrorMessage="Days
must be between 1 and 14.">
</asp:RangeValidator>
Sử dụng khi nào???
Sử dụng để hiển thị toàn bộ thông tin lỗi của các validator
trên trang
Hiển thị như thế nào???
Hiển thị trên trang Web hoặc dưới dạng Message Box
Gồm một HeaderText theo sau là danh sách các lỗi (thuộc
tính ErrorMessage) của các điều khiển Validation
Danh sách lỗi hiển thị dưới dạng: BulletList, List…
Validation Summary
Sử dụng khi nào???
Sử dụng để hiển thị toàn bộ thông tin lỗi của các validator
trên trang
Hiển thị như thế nào???
Hiển thị trên trang Web hoặc dưới dạng Message Box
Gồm một HeaderText theo sau là danh sách các lỗi (thuộc
tính ErrorMessage) của các điều khiển Validation
Danh sách lỗi hiển thị dưới dạng: BulletList, List…
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
20
Validation Summary
Thuộc tính HeaderText của điều khiển ValidationSummary
Thuộc tính ErrorMessage
của điều khiển
RequiredFieldValidator
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
21
RequiredFieldValidator Validation Summary
Thông điệp * được thiết lập cho thuộc tính Text của điều khiển
RequiredFieldValidator
Thuộc tính ErrorMessage
của điều khiển
RequiredFieldValidator
Các thuộc tính của điều khiển Validation Summary
Validation Summary
Thuộc tính
Điều khiển
DisplayMode
Định dạng hiển thị của thông báo lỗi
Giá trị: BulletList, List hoặc SingleParagrap
Mặc định: BulletList
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
22
Định dạng hiển thị của thông báo lỗi
Giá trị: BulletList, List hoặc SingleParagrap
Mặc định: BulletList
HeaderText
Đoạn văn bản hiển thị trước danh sách thông báo lỗi
ShowSummary
Có /Không hiển thị điều khiển Validation Summary
(True/False). Mặc định True
ShowMessageBox
Có/Không hiển thị thông báo lỗi trên Message box (chỉ
trong trường hợp Client Validation. (Mặc định False)
Mã .aspx của các điều khiển Validation của Web Form có
giao diện như hình bên dưới
Ví dụ
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server"
ControlToValidate="lstCardType" InitialValue="None"
ErrorMessage="You must select a credit card type."
Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2"
runat="server"
ControlToValidate="txtCardNumber"
ErrorMessage="You must enter a credit card number."
Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:ValidationSummary ID="ValidationSummary1"
runat="server"
HeaderText="Please correct the following errors:"/>
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
23
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server"
ControlToValidate="lstCardType" InitialValue="None"
ErrorMessage="You must select a credit card type."
Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2"
runat="server"
ControlToValidate="txtCardNumber"
ErrorMessage="You must enter a credit card number."
Display="Dynamic">*</asp:RequiredFieldValidator>
<asp:ValidationSummary ID="ValidationSummary1"
runat="server"
HeaderText="Please correct the following errors:"/>
Sử dụng khi nào????
Khi cần so khớp dữ liệu người dùng nhập vào với một biểu
thức chính quy được chỉ định sẵn
Ví dụ về biểu thức: \d{3} : Kí tự nhập vào phải là ba con
số
Chỉ định biểu thức sử dụng thuộc tính: Validation
Expression
Regular Expresion Validator
Sử dụng khi nào????
Khi cần so khớp dữ liệu người dùng nhập vào với một biểu
thức chính quy được chỉ định sẵn
Ví dụ về biểu thức: \d{3} : Kí tự nhập vào phải là ba con
số
Chỉ định biểu thức sử dụng thuộc tính: Validation
Expression
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
24
Nút mở cửa sổ Regular
Expression Editor
Hai loại biểu thức
Biểu thức chính quy chuẩn do Visual Studio
cung cấp
Tạo bằng cách sử dụng cửa sổ
Regular Expression Editor
Biểu thức tùy biến (Custom expression)
Tạo thành từ các phần tử
biểu thức chính quy
Regular Expresion Validator
Hai loại biểu thức
Biểu thức chính quy chuẩn do Visual Studio
cung cấp
Tạo bằng cách sử dụng cửa sổ
Regular Expression Editor
Biểu thức tùy biến (Custom expression)
Tạo thành từ các phần tử
biểu thức chính quy
Kiểm tra tính hợp lệ của dữ liệu & Quản lý trạng thái
25