VÍ DỤ MINH HỌA & CÁCH ÁP DỤNG CÔNG NGHỆ AJAX

VÍ DỤ MINH HỌA & CÁCH ÁP DỤNG CÔNG NGHỆ AJAX

Đừng để danh sách những công nghệ làm nên AJAX “hù dọa” bạn. Thực ra việc tìm hiểu nghiên cứu và áp dụng công nghệ này rất đơn giản và thậm chí bạn không cần phải hiểu rõ cách sử dụng những công nghệ thành phần (ví dụ như DOM – tất nhiên nếu bạn biết về DOM thì sẽ rất tuyệt, nhưng nếu bạn không biết về nó thì cũng không sao). Bản thân tớ chỉ mất 1 ngày để mày mò nghiên cứu bản chất và áp dụng công nghệ này thực hiện một ví dụ minh họa cho bài viết.

Trong ví dụ sau, tớ sẽ tạo một mẫu đơn đăng ký nho nhỏ, yêu cầu người dùng chọn một tên đăng nhập và cung cấp một địa chỉ email không được trùng lặp với bất kỳ ai trong cơ sở dữ liệu đã có. Bằng cách sử dụng Ajax, tớ có thể kiểm tra so sánh với danh sách tên trong cơ sở dữ liệu ngay sau khi người dùng vừa mới nhập tên xong và báo lỗi ngay nếu nó bị trùng (không cần đợi người dùng phải gửi mẫu đơn đi). Điều tương tự xảy ra đối với địa chỉ email, chỉ thêm một cái là tớ kiểm tra luôn định dạng của nó có phải là một địa chỉ email hay không trước khi áp dụng.

Sau khi chọn tên và email xong (tất nhiên là sau khi tớ đã kiểm tra là chúng hợp lệ), người dùng có thể nhấn nút tạo tài khoản – và lần này tớ cũng sử dụng luôn Ajax để thực hiện việc này (minh họa khả năng thay đổi trực tiếp vào cơ sở dữ liệu). Để ý là bạn hoàn toàn không phải rời khỏi trang đăng ký trong bất kỳ giai đoạn nào. Tất cả xảy ra liền mạch và nhanh chóng.

Cũng hy vọng bạn sẽ để ý chi tiết sau: mặc dù đây là một ví dụ minh họa công nghệ Ajax, tớ cũng muốn minh họa tầm quan trọng của cách thức bạn tương tác với người dùng. Để ý khi bạn đưa chuột vào một ô nào đó (ô đó sẽ sáng lên cho biết những gì bạn gõ sẽ là vào ô đó), khi có thông báo lỗi (ô bị lỗi sẽ chuyển sang màu đỏ và bạn tự động được chuyển ngược về ô đó để sửa) hay khi dữ liệu của bạn là hợp lệ (ô chuyển sang màu xanh da trời).

Thêm một bước nữa, tớ đã thiết kế để một khi dữ liệu còn chưa hoàn tất (chưa có đủ tên và email, hoặc tên hay email bị trùng) thì bạn sẽ không thể gửi đơn đi được (nút Submit bị vô hiệu hóa). Chỉ là những ứng dụng rất nhỏ và chi tiết nhưng nó giúp cho ứng dụng của bạn dễ sử dụng hơn rất nhiều.

Bạn sẽ tìm thấy mã nguồn cũng như hướng dẫn từng bước áp dụng công nghệ này tại trang ví dụ.

KẾT LUẬN

Chỉ mới xuất hiện trong một thời gian ngắn nhưng công nghệ Ajax đã tỏ ra rất hứa hẹn, thậm chí đến nay người ta vẫn chưa khám phá ra hết những gì công nghệ này có thể làm được.

Bạn có từng tự “trách” là tại sao bạn không được sinh vào đúng thời điểm khi mà các công nghệ chỉ mới ở giai đoạn đầu và chưa có phát minh nào cả để bạn có thể là người phát mình ra chúng (đôi khi thấy nhiều thứ đơn giản đến thế – cứ như “biếu không” ;))? Nếu vậy thì đây chính là cơ hội để bạn tạo ra dấu ấn của riêng mình: công nghệ Ajax còn rất nhiều điều chưa được khám phá và bạn đang có cùng điểm xuất phát như nhiều người khác…

Hoặc nếu ngay cả bạn không có “ham muốn” được nổi tiếng qua các phát minh thì công nghệ Ajax vẫn đáng để bạn bỏ thời gian ra nghiên cứu bởi nó sẽ giúp ích rất nhiều cho những sản phẩm sau này của bạn.

CHÚ Ý:

Bài viết có sử dụng thông tin tham khảo từ các bài viết (tiếng Anh):

Ajax: A New Approach to Web Applications (AdaptivePath)
XMLHttpRequest Usability Guidelines

Và các thông tin chung tổng hợp từ:

AjaxMatters.com
Wikipedia : Ajax

-sưu tầm-

Về vdhungbg
Tin tuc cap nhat - moi luc - moi noi

One Response to VÍ DỤ MINH HỌA & CÁCH ÁP DỤNG CÔNG NGHỆ AJAX

Gửi phản hồi

Please log in using one of these methods to post your comment:

WordPress.com Logo

Bạn đang bình luận bằng tài khoản WordPress.com Log Out / Thay đổi )

Twitter picture

Bạn đang bình luận bằng tài khoản Twitter Log Out / Thay đổi )

Facebook photo

Bạn đang bình luận bằng tài khoản Facebook Log Out / Thay đổi )

Google+ photo

Bạn đang bình luận bằng tài khoản Google+ Log Out / Thay đổi )

Connecting to %s

%d bloggers like this: