AJAX Control Toolkit chứa một tập hợp các điều khiển và điều khiển mở rộng. Trong hướng dẫn ngắn gọn này, bạn tìm hiểu làm thế nào để bổ sung các điều khiển và mở rộng điều khiển đến trang ASP.NET.
Tên bài viết: Hướng dẫn sử dụng Ajax Control Toolkit Extender
Tác giả: QuangIT
Cấp độ bài viết: Không dành cho người mới bắt đầu làm quen với ASP.Net
Để được hướng dẫn về cài đặt AJAX Control Toolkit và thêm AJAX Control Toolkit Visual Studio / hộp công cụ Visual Web Developer, xem hướng dẫn
Bắt đầu với AJAX Control Toolkit.
Sử dụng AJAX Control Toolkit Controls
Điều khiển AJAX Control Toolkit hoạt động giống như điều khiển ASP.NET bình thường. Bạn có thể kéo điều khiển từ hộp công cụ vào trang ASP.NET. Bạn có thể thêm các điều khiển vào trang trong chế độ xem design hoặc xem mã nguồn(source).
Là một trong những yêu cầu đặc biệt khi sử dụng các điều khiển từ AJAX Control Toolkit. Trang có chứa một điều khiển ScriptManager. Điều khiển ScriptManager chịu trách nhiệm tất cả các JavaScript cần thiết theo yêu cầu của điều khiển AJAX Control Toolkit.
Ví dụ, tab AJAX Control Toolkit bao gồm một điều khiển có tên là Editor control. Điều khiển này hiển thị một trình soạn thảo phong phú HTML. Thực hiện theo các bước sau để thêm các điều khiển Editor đến trang:
- Tạo một trang ASP.NET mới có tên ShowEditor.aspx
- Chọn điều khiển ScriptManager từ bên dưới tab Tiện ích mở rộng AJAX trong hộp công cụ và kéo điều khiển lên trang.
- Chọn điều khiển từ bên dưới các tab AJAX Control Toolkit trong hộp công cụ biên tập và kéo điều khiển lên trang (xem hình 1). Designer sẽ giống như hình 2.
- Chạy trang web bằng cách chọn tùy chọn trình đơn Debug, Start Debugging hoặc nhấn phím F5.
- Bạn sẽ thấy trang trong hình 3.
Hình 1: Chọn điều khiển HTML Editor
Hình 2: Visual Studio với Control ScriptManager và Editor
Hình 3: Hiển thị trang ShowEditor.aspx
Sử dụng Control AJAX Control Toolkit Extenders
AJAX Control Toolkit cũng chứa Control Extender. Như tên gọi của nó cho thấy, một bộ điều khiển mở rộng các chức năng của một điều khiển hiện có. Ví dụ, mở rộng kiểm soát ConfirmButton mở rộng các tiêu chuẩn kiểm soát Button ASP.NET. Extender thay đổi nút điều khiển hành vi để Button hiển thị một hộp thoại xác nhận khi bạn nhấp vào nó.
Control extender, giống như Control AJAX Control Toolkit, đòi hỏi một control ScriptManager. Bạn phải thêm một control ScriptManager đến trang trước khi bạn bắt đầu sử dụng các control extender trong trang.
Thực hiện theo các bước sau để sử dụng các control extender ConfirmButton:
- Tạo một trang ASP.NET mới có tên ShowConfirmButton.aspx
- Thêm một điều khiển ScriptManager vào trang bằng cách kéo một điều khiển lên trang từ bên dưới tab Tiện ích mở rộng AJAX.
- Thêm một button chuẩn vào trang bằng cách kéo nút từ bên dưới tab chuẩn trong hộp công cụ lên bề mặt thiết kế.
- Click tùy chọn task Add Extender (xem hình 4).
- Trong hộp thoại Choose Extender, chọn ConfirmButtonExtender (xem hình 5) và nhấn vào nút OK.
- Chọn điều khiển button trong chế độ xem Design và mở rộng Extenders, nút Button1_ConfirmButtonExtender trong cửa sổ Properties (xem hình 6). Gán giá trị Really? đến thuộc tính ConfirmText.
- Chạy trang bằng cách chọn tùy chọn trình đơn Debug, Start Debugging hoặc nhấn phím F5.
Hình 4: Chọn tùy chọn Add Extender
Hình 5: Chọn ConfirmButton control extender
Hình 6: Thiết lập thuộc tính ConfirmButton
Hình 7: Khi trang web mở ra, bạn sẽ thấy một button. Khi bạn nhấn button, bạn nhận được hộp thoại xác nhận
Chú ý: Người dùng thường không kéo control extender vào trang. Thay vào đó, bạn sử dụng tùy chọn Add Extender để thêm một bộ mở rộng với một điều khiển mà bạn đã thêm vào trang. Hơn nữa, bạn thiết lập thuộc tính control extender bằng cách mở trang thuộc tính cho điều khiển mở rộng.