Bài giảng Công nghệ Web - Bài 08: Làm việc với Controls - Lê Quang Lợi

Bài 08: Làm việc với Controls Lê Quang Lợi Email: loilequang@gmail.com loilq@utehy.edu.vn Bài 08: Làm việc với Controls » Controls » Cú pháp » Phân loại » Tương tương tác Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.1 Khái quát về Controls (Server Controls) » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.2 Cú pháp Controls » 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ụ: Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.2 Cú pháp Controls » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3 Phân loại » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.1 HTML Controls » 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”) Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.2 Standard Controls » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.2 Standard Controls » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.2 Standard Controls » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.3 Validation Control » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.4 Rick Control » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.3.5 Menu Cotrols (tự nghiên cứu) » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.4 Đối tượng Controls » 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 Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY 8.5 Tương tác với Control » 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()); Lê Quang Lợi: loilequang@gmail.com Môn học : Công nghệ WEB (ASP.NET) CNPM-CNTT-ĐHSPKT HY