AJAX dạng đầy đủ là JavaScript và XML không đồng bộ. Đó là một công nghệ làm giảm sự tương tác giữa máy chủ và máy khách. Nó thực hiện điều này bằng cách chỉ cập nhật một phần của trang web thay vì toàn bộ trang. Các tương tác không đồng bộ được bắt đầu bởi JavaScript. Mục đích của AJAX là trao đổi một lượng nhỏ dữ liệu với máy chủ mà không cần làm mới trang
JavaScript là ngôn ngữ kịch bản phía máy khách. Nó được thực thi ở phía máy khách bởi các trình duyệt web hỗ trợ JavaScript. Mã JavaScript chỉ hoạt động trong các trình duyệt đã bật JavaScript
XML là từ viết tắt của Extensible Markup Language. Nó được sử dụng để mã hóa tin nhắn ở cả định dạng người và máy có thể đọc được. Nó giống như HTML nhưng cho phép bạn tạo các thẻ tùy chỉnh của mình. Để biết thêm chi tiết về XML, hãy xem bài viết về XML
Tại sao nên sử dụng AJAX?
- Nó cho phép phát triển các ứng dụng web tương tác phong phú giống như các ứng dụng máy tính để bàn
- Việc xác thực có thể được thực hiện khi người dùng điền vào biểu mẫu mà không cần gửi biểu mẫu đó. Điều này có thể đạt được bằng cách sử dụng hoàn thành tự động. Các từ mà người dùng nhập vào được gửi đến máy chủ để xử lý. Máy chủ phản hồi với các từ khóa khớp với những gì người dùng đã nhập
- Nó có thể được sử dụng để điền vào hộp thả xuống tùy thuộc vào giá trị của hộp thả xuống khác
- Dữ liệu có thể được lấy từ máy chủ và chỉ một phần nhất định của trang được cập nhật mà không cần tải toàn bộ trang. Điều này rất hữu ích cho các phần trang web tải những thứ như
- Tweet
- giao tiếp
- Người dùng truy cập trang web, v.v.
Cách tạo một ứng dụng PHP Ajax
Chúng ta sẽ tạo một ứng dụng đơn giản cho phép người dùng tìm kiếm các framework PHP MVC phổ biến
Ứng dụng của chúng tôi sẽ có một hộp văn bản mà người dùng sẽ nhập tên của khung
Sau đó, chúng tôi sẽ sử dụng mvc AJAX để tìm kiếm kết quả khớp rồi hiển thị tên đầy đủ của khung ngay bên dưới biểu mẫu tìm kiếm
Bước 1] Tạo trang chỉ mục
Mục lục. php
PHP MVC Frameworks - Search EnginePHP MVC Frameworks - Search Engine
Type the first letter of the PHP MVC Framework
Matches:
ĐÂY,
- “onkeyup=”showName[this. value]”” thực thi hàm JavaScript showName mỗi khi một khóa được nhập vào hộp văn bản
Tính năng này được gọi là tự động hoàn thành
Bước 2] Tạo trang khung
khuôn khổ. php
Bước 3] Tạo tập lệnh JS
auto_complete. js
function showName[str]{ if [str.length == 0]{ //exit function if nothing has been typed in the textbox document.getElementById["txtName"].innerHTML=""; //clear previous results return; } if [window.XMLHttpRequest] {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest[]; } else {// code for IE6, IE5 xmlhttp=new ActiveXObject["Microsoft.XMLHTTP"]; } xmlhttp.onreadystatechange=function[] { if [xmlhttp.readyState == 4 && xmlhttp.status == 200]{ document.getElementById["txtName"].innerHTML=xmlhttp.responseText; } } xmlhttp.open["GET","frameworks.php?name="+str,true]; xmlhttp.send[]; }
ĐÂY,
- “nếu [str. length == 0]” kiểm tra độ dài của chuỗi. Nếu nó là 0, thì phần còn lại của tập lệnh không được thực thi
- “nếu [cửa sổ. XMLHttpRequest]…” Internet Explorer phiên bản 5 và 6 sử dụng ActiveXObject để triển khai AJAX. Các phiên bản và trình duyệt khác như Chrome, FireFox sử dụng XMLHttpRequest. Mã này sẽ đảm bảo rằng ứng dụng của chúng tôi hoạt động trong cả IE 5 & 6 cũng như các phiên bản IE và trình duyệt cao cấp khác
- “xmlhttp. onreadystatechange=function…” kiểm tra xem tương tác AJAX đã hoàn tất chưa và trạng thái là 200 rồi cập nhật khoảng txtName với kết quả trả về
Bước 4] Kiểm tra ứng dụng PHP Ajax của chúng tôi
Giả sử bạn đã lưu chỉ mục tệp. php Trong phututs/ajax, duyệt đến URL http. //localhost/phptuts/ajax/index. php
Gõ chữ C vào ô text Bạn sẽ được kết quả như sau
Ví dụ trên minh họa khái niệm về AJAX và cách nó có thể giúp chúng ta tạo các ứng dụng tương tác phong phú