Bài giảng Lập trình Asp.Net - Phần 4.2: Validation Control - Nguyễn Hà Giang

Nguyễn Hà GiangValidation ControlNguyen Ha Giang1Nội dungValidation controlChức năng validation cho việc data inputQuá trình validation trên web formCác validation controlRequiredFieldValidatorCompareValidatorRangeValidatorRegularExpressionValidatorCustomValidatorValidationSummary2Nguyen Ha GiangTại sao phải validation?Có rất nhiều lỗi có thể xảy ra trên web formUser có thể bỏ qua thông tin quan trọng (bỏ trống)User có thể nhập không đúng định dạngĐịa chỉ email, số điện thoạiUser có thể nhập ký tự chữ cái trong ô nhập dữ liệu số!User có thể submit giá trị ngoài miền cho phép3Nguyen Ha GiangTại sao phải validation?Web App gặp phải một số khó khăn khi validation, do dựa trên các HTML input control cơ bản. Không có đặc tính tương đồng với Windows App Kỹ thuật chung của Windows App là xử lý sự kiện KeyPress của TextBox để kiểm tra việc chỉ nhập ký tự sốĐiều này không thể trong Web app, do việc post back server thì chậm!Thậm chí nếu sử dụng client- side JavaScript, user cũng có thể né trách việc kiểm tra và post giá trị không hợp lệ!4Nguyen Ha GiangValidation controlClient side validationPhụ thuộc vào browserPhản hồi nhanhGiảm việc post backServer side validationThực thi kể cả client side đã validationCó thể check nâng cao Sử dụng .NET classDatabase5Nguyen Ha GiangValid?Valid?User nhập liệuNoNoYesYesThông điệplỗiClientServerWeb App xử lýValidation controlCung cấp các chức năng đảm bảo việc nhập liệu từ user luôn phù hợp yêu cầu của app!6Nguyen Ha GiangNever trust user input!Validation controlRequiredFieldValidator: xác nhận thành công khi nhập liệu không phải chuỗi rỗngRangeValidator: Xác nhận thành công khi nhập liệu nằm trong miền xác định.CompareValidator: Xác nhận thành công khi dữ liệu có giá trị phù hợp với giá trị khác hoặc giá trị của control khác.RegularExpressionValidator: Xác nhận thành công khi dữ liệu phù hợp với một định dạng xác định.CustomValidator: cho phép kiểm tra nâng cao ở server, check dữ liệu trong databaseValidationSummary: hiển thị lỗi hoặc chi tiết các lỗi7Nguyen Ha GiangValidation controlMỗi validation control gắn với 01 input controlCó thể tạo nhiều validation control cho cùng 1 controlNếu sử dụng RangeValidator, CompareValidator, hoặc RegularExpressionValidator, xác nhận sẽ thành công khi dữ liệu nhập của control là rỗng, do ko có dữ liệu so sánh!Khắc phục bằng cách thêm RequiredFieldValidator cho control!8Nguyen Ha GiangQuá trình validationKhi sử dụng automatic validation, user sẽ nhận được page bình thường và chuẩn bị nhập liệuPhụ thuộc vào browser, lỗi có thể xuất hiện ngay khi user điền dữ liệuKhi chuyển focus, xử lý script phía client!9Nguyen Ha GiangQuá trình validationKhi hoàn thành, user kích vào button để submit pageMỗi button có thuộc tính CausesValidation có hai giá trịFalse: sẽ bỏ qua các validation control, trang web sẽ được post back và code xử lý sự kiện sẽ chạy bình thườngTrue: ASP.NET sẽ tự động validation các control trong page. Nếu client-side validation được hỗ trợ, nó sẽ ngưng trang web khỏi việc post backValidation diễn ra tự động khi button với CausesValidation là true được kích hoạtValidation ko xảy ra khi page được post back do sự kiện change hoặc user kích vào button với CausesValidation là false10Nguyen Ha GiangQuá trình validationNếu client-side validation không hỗ trợ, trang sẽ được post back và page life cycle được thực hiện!Khi điều này xảy ra thì phải biết và không thực hiện phần xử lýPage.IsValid là false nếu có bất cứ VC nào failPage.IsValid là true nếu tất cả VC thành công, hoặc validation ko thực thi!11Nguyen Ha Giangprotected void cmdOK_Click(Object sender, EventArgs e) { // bỏ qua sự kiện khi control không được xác nhận if (!Page.IsValid) return; // phần xử lý bình thường nếu validation thành công! lblMessage.Text = “Trình xử lý sự kiện Click của button thực thi!";}Các thuộc tính chungThuộc tínhÝ nghĩaControlToValidateTên control cần kiểm tra, phải xác định khi sử dụng VCTextChuỗi thông báo xuất hiện khi có lỗiErrorMessageChuỗi thông báo xuất hiện trong ValidationSummary. Giá trị này sẽ được hiển thị tại vị trí của điều khiển nếu không gán giá trị cho thuộc tính textDisplayHình thức hiển thị:None: không hiển thị thông báo lỗiStatic: trong trường hợp ko vi phạm, điều khiển không xuất hiện nhưng vẫn chiếm vị trí như lúc thiết kếDynamic: tương tự như static nhưng không chiếm vị tríEnableClientScriptCho phép kiểm tra ở client hay không, mặc định là cóValidationGroupThiết lập nhóm validate12Nguyen Ha GiangRequiredFieldValidatorSử dụng để bắt buộc một control nào đó phải được nhập liệu!Thuộc tínhInitialValue: giá trị khởi động. Giá trị nhập phải khác giá trị này, mặc định là rỗng13Nguyen Ha GiangRequiredFieldValidatorMinh họa dùng RequiredFieldValidator14Nguyen Ha GiangChọn control cần kiểm tra dữ liệu1Nhập chuỗi hiển thị lỗi2RequiredFieldValidatorChạy web form15Nguyen Ha GiangHiển thị thông báo lỗi khi không nhập liệu cho textboxCompareValidatorDùng để so sánh giá trị của một control với giá trị control khác hoặc một giá trị xác địnhThông qua thuộc tính Operator, ta có thể thực hiện phép so sánh như: =, , >,=,, >=, DataTypeCheck: kiểm tra kiểu dữ liệuType: quy định kiểu dữ liệu để kiểm tra String, Integer, Double, Date, CurrencyValueToCompare: giá trị cần so sánh17Nguyen Ha GiangCompareValidatorMinh họa dùng CompareValidator kiểm tra việc nhập giá trị số18Nguyen Ha GiangThông báo lỗiToán tử kiểm tra: kiểm tra kiểu dữ liệuKiểu số nguyênCompareValidatorChạy web form19Nguyen Ha GiangNhập abcNhập 123RangeValidatorKiểm tra giá trị của điều khiển nằm khoảng từ min  maxDùng để kiểm tra ràng buộc miền giá trịNếu ko nhập dữ liệu thì ko thực hiện kiểm traThuộc tính:MinimumValue: giá trị nhỏ nhấtMaximumValue: giá trị lớn nhấtType: xác định kiểu để kiểm tra dữ liệuString, integer, double, date, currency20Nguyen Ha GiangRangeValidatorTạo web form nhập tuổi lao động, hợp lệ từ 18 - 5521Nguyen Ha GiangControl cần xác nhận dữ liệuThông điệp lỗiMiền giá trị hợp lệRangeValidatorChạy web form22Nguyen Ha GiangNhập 10Nhập 20RegularExpressionValidatorKiểm tra giá trị phải theo mẫu quy định trước: địa chỉ email, số điện thoại, mã vùng, số chứng minhTrong trường hợp không nhập liệu thì không kiểm traThuộc tínhValidationExpress: mẫu kiểm tra 23Nguyen Ha GiangChuỗi mô tả quy tắc emailRegularExpressionValidatorKý hiệuMô tảAKý tự chữ cái, đã được xác định, ví dụ: a1Ký tự số, đã được xác định, ví dụ: 1[0-n]Ký tự số từ 0 → 9[abc]Một ký tự: a hoặc b hoặc c|Lựa chọn mẫu này hoặc mẫu khác\wKý tự thay thế là chữ cái\dKý tự thay thế là ký tự số\Thể hiện ký tự đặc biệt theo sau\.Ký tự thay thế phải là dấu chấm câu?Quy định số lần xuất hiện: 1 hoặc n lần*Quy định số lần xuất hiện: 0 hoặc n lần+Số lần xuất hiện 1 hoặc nhiều lần{n}Số lần xuất hiện đúng n lần24Nguyen Ha GiangRegularExpressionValidatorTạo form check e-mail25Nguyen Ha GiangRegularExpressionValidatorChạy web form26Nguyen Ha GiangNhập đúng định dạng emailNhập sai quy tắcCustomValidator Điều khiển này cho phép bạn tự viết hàm xử lý kiểm tra lỗiSự kiện:ServerValidate: đặt các hàm kiểm tra dữ liệu trong sự kiện này. Việc kiểm tra thực hiện ở server!27Nguyen Ha GiangCustomValidatorMinh họa: web form yêu cầu nhập 1 số, nếu số là lẻ thì ko xác nhận và hiển thị thông báo yêu cầu phải nhập số chẵn. Ngược lại, xử lý điều gì đó (xuất ra thông báo!)28Nguyen Ha GiangTextboxCustomValidation: sẽ thiết kế hàm validation riêngButton sẽ post back server: xử lý khi IsValid = trueCustomValidatorKhai báo sự kiện ServerValidator cho CustomValidator29Nguyen Ha GiangChọn tab eventDouble click vào sự kiện ServerValidate để tạo trình xử lý trên server12CustomValidatorTrình xử lý ServerValidate trên server30Nguyen Ha Giangprotected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args){ // xác nhận số nhập vào là số chẵn if ((int.Parse(TextBox1.Text) % 2) == 0) args.IsValid = true; // xác nhận đúng else args.IsValid = false; // chưa xác nhận}Khi hàm trả về, args.IsValid là true thì dữ liệu của control được xác nhận ngược lại chưa xác nhậnCustomValidatorXử lý sự kiện click của button checkKhông xử lý nếu chưa xác nhận dữ liệuXử lý đơn giản: xuất ra thông tin đã nhập số chẵn31Nguyen Ha Giangprotected void btnCheck_Click(object sender, EventArgs e){ if ( !IsValid ) // nếu chưa xác nhận trả về => không xử lý return; // nếu xác nhận dữ liệu => thông báo nhập số chẵn Response.Write("Bạn nhập số chẵn"); }CustomValidator32Nguyen Ha GiangNhập 900Nhập 999Kích vào Check!Kích vào Check!ValidationSummaryĐiều khiển dùng để hiển thị ra bảng lỗi chứa tất cả các lỗi trên trang web.Nếu điều khiển nào có dữ liệu không hợp lệ, giá trị thuộc tính ErrorMessage của validation control sẽ được hiển thịNếu giá trị của thuộc tính ErrorMessage không được xác định, thông báo lỗi sẽ không xuất hiện trong bảng lỗiCác thuộc tínhHeaderText: dòng tiêu đề thông báo lỗiShowMessageBox: quy định thông báo lỗi có được phép hiển thị như cửa sổ MessageBox hay không, mặc định là falseShowSummary: bảng thông báo được hiển thị hay không, mặc định là true33Nguyen Ha GiangDemo sử dụng validation controlTạo form cho phép user nhập thông tin đăng ký khách hàng.Giao diện minh họa như hình bên34Nguyen Ha GiangDemo sử dụng validation controlĐiều khiểnKiểuThuộc tínhGiá trịrfvTenDNRequiredFieldControlToValidateErrorMessagetxtTenKHTên đăng nhập không rỗngrfvMatKhauRequiredFieldControlToValidateErrorMessagetxtMatKhauMật khẩu không được rỗngrfvMauKhauNLRequiredFieldControlToValidateErrorMessagetxtMauKhauNLKhông được rỗngcvMatKhauNLCompareControlToValidateControlToCompareErrorMessagetxtMauKhauNLtxtMatKhauMật khẩu gõ lại không khớprfvTenKHRequiredFieldControlToValidateErrorMessagetxtTenKHHọ tên không rỗng35Nguyen Ha GiangDemo sử dụng validation control36Nguyen Ha GiangĐiều khiểnKiểuThuộc tínhGiá trịcvNgaySinhCompareControlToValidateOperatorErrorMessagetxtNgaySinhDataTypeCheckDaterevEmailRegularExpressionControlToValidateValidationExpressionErrorMessagetxtEmailInternet emailEmail không hợp lệrvThuNhapRangeControlToValidateMaximumValueMinimumValueTypeErrorMessagetxtThuNhap500000001000000IntegerThu nhập từ 1 – 50 triệuvsDanhSachLoiValidationSummaryHeaderTextShowMessageBoxDanh sách các lỗitrueDemo sử dụng validation controlChạy web form37Nguyen Ha GiangDemo sử dụng validation controlChạy web form38Nguyen Ha GiangThông báo danh sách lỗi trong cửa sổ popupTóm tắt các lỗiBài tậpMột công ty giới thiệu việc làm, cần xây dựng trang web cho phép người dùng đăng ký việc làm trực tuyến.Hãy phác thảo form tuyển dụngMô tả các phần kiểm tra dữ liệu của form trên.39Nguyen Ha Giang