Công nghệ web - Bài 08: Làm việc với Controls

Bài 08: Làm việc với Controls Lê Quang Lợi Email: loilequang@gmail.com loilq@utehy.edu.vn Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Controls » Cú pháp » Phân loại » Tương tương tác Bài 08: Làm việc với Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Server Control: một giao diện cụ thể (thiết kế) » Kế thừa từ đối tượng Control (System.Web.UI.Control) » Cho phép thiết kế giao diện tương tác người dùng » Hỗ trợ thiết kế theo Template » Hỗ trợ lập trình sự kiện trên các control » Nhiều control hỗ trợ yêu cầu cụ thể » Khi dịch trả về: thẻ/tập thẻ HTML 8.1 Khái quát về Controls (Server Controls) Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Cú pháp » ID/Tên: tên của server control » Thuộc tính: quy định giá trị của control » ID, Runat » Text, Value, Items, » Thuộc tính sự kiện: cho phép nối với hàm xử lý sự kiện » Click, DoubleClick, Forcus . Ví dụ: 8.2 Cú pháp Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Một số thuộc tính hay dùng trong các control  ID: tên định danh của thẻ  Runat: chỉ định cài đặt phía server  CSSClass: CSS cho server control  Font: Font chữ cho control  Enable: cho phép /không cho phép control sử dụng  Visitable: hiển thị/không hiển thị mặc định là True 8.2 Cú pháp Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » HTML Control: thể hiện thẻ HTML trên trang ASP.NET » Control cơ bản: Cung cấp giao diện cơ bản( field) » Control nâng cao: Cung cấp giao diện phức tạp » Control Validation: kiểm tra tính hợp lệ dữ liệu control » DataControl: kết nối và hiển thị CSDL » Webpart Control: Control được xây dựng sẵn » Ajax Control : Control hỗ trợ kỹ thuật Ajax trong ASP.NET 8.3 Phân loại Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Thể hiện thẻ HTML trong trang ASP.NET » Mỗi thẻ HTML được coi là HTML Control » Server không dịch (chuyển thẳng về phía Client) » Cho phép thiết kế giao diện trang Web » Chuyển thành ServerControl: thêm (runat=“server”) 8.3.1 HTML Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » CommandControls: Button, imageButton, LinkButton  Thuộc tính Text: chứa/hiển thị văn bản được gõ/cài đặt  Sự kiện click: thể hiện sự kiện tương tác với server  Thực hiện hàm (submit/postback): gửi dữ liệu về Server » Trường dữ liệu:Text, Lable, RadioButton, Checkbox  Text: Giá trị văn bản của đối tượng  TextMode=“Single/MultiLine/Password”: (Chế độ hiển thị)  Checked: true/false (lựa chọn == true; ngược lại == false)  Thể hiện trường nhập dữ liệu 8.3.2 Standard Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » ListControls: ListBox, RadioButtonList, CheckedListBox » Thể hiện danh sách các đối tượng trong nhóm » Thuộc tính » Items: thể hiện tập các Item trong nhóm » SelectedItem/SlectedText/Selectedvalue: chọn Item » Sự kiện SelectedChange: Khi thay đổi lựa chọ item 8.3.2 Standard Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Table: thể hiện bảng dữ liệu theo hàng và cột  Thuộc tính: rows, cols chứa các hàng và cột » Image: thể hiện hình ảnh  Thuộc tính navigatorURL chứa vị trí file ảnh » Panel: dựa trên thẻ div và chứa các control khác » Multivew: thể hiện nhiều khung cảnh (giao diện)  Thuộc tính Views: chứa các view trong mutlview  Phương thức SetView: thể hiện view được thiết lập 8.3.2 Standard Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Control kiểm tra dữ liệu cho Controls khác » Các Controls  RequiredValidator: yêu cầu không được để trống  RangeValidator: nhập theo phạm vi  ComparedValidator: so sánh giá trị trong các server control  RegularExpesstionValidator:phù hợp biểu thức mẫu  CustomValudator: các loại đơn giản khác » Thuộc tính  ControlsToValidator: chỉ ra control cần kiển tra  ErrorMessage: thông báo nếu có lỗi 8.3.3 Validation Control Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Login, Logout, Regist, Reset » Calendard: lịch biểu trên webform » Thể hiện các giao diện tích hợp của các controls cơ bản » Thể hiện cấu trúc giao diện riêng/đặc thù » Xây dựng sẵn từ server controls 8.3.4 Rick Control Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Menu: thể hiện danh sách các Item trong nhóm » SiteMap: thể hiện bản đồ trang web » TreeView : thể hiện Menu dạng cây (Tree Node) Chú ý: Ý nghĩa, cách sử dụng, sự kiện, các thuộc tính quan trọng 8.3.5 Menu Cotrols (tự nghiên cứu) Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Các control đều kế thừa từ lớp Control  Các thuộc tính: ID, Reunat ,  Phương thức (hàm): function  Sự kiện: Click, Forcus » Đối tượng Control tạo ra thể nghiệm cụ thể của control » Cho phép tương tác control bằng lập trình 8.4 Đối tượng Controls Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY » Tạo control: Button btn = new Button(); » Đính control trong giao diện: .Controls.Add(btn); » Sử dụng Control  Thiết lập thuộc tính: btn.Text=“ClickMe”;  Lấy giá trị thuộc tính: string str=btn.Text  Cài đặt sự kiện cho control btn.Click += new EventHandler( myClick()); 8.5 Tương tác với Control