Ví dụ PHP AJAX
AJAX được sử dụng để tạo ra nhiều ứng dụng tương tác hơn.
Ví dụ PHP AJAX
Ví dụ sau minh họa cách một trang web có thể giao tiếp với máy chủ web trong khi người dùng nhập các ký tự vào trường nhập:
Thí dụ
Bắt đầu nhập tên vào trường nhập bên dưới:
Giải thích ví dụ
Trong ví dụ trên, khi người dùng nhập một ký tự vào trường nhập, một hàm có tên "showHint ()" sẽ được thực thi.
Chức năng được kích hoạt bởi sự kiện onkeyup.
Đây là mã HTML:
Thí dụ
<html>
<head>
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new
XMLHttpRequest();
xmlhttp.onreadystatechange = function()
{
if (this.readyState == 4 &&
this.status == 200) {
document.getElementById("txtHint").innerHTML =
this.responseText;
}
};
xmlhttp.open("GET", "gethint.php?q=" + str, true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the
input field below:</b></p>
<form>
First name: <input type="text"
onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
Giải thích mã:
Đầu tiên, hãy kiểm tra xem trường đầu vào có trống không (str.length == 0). Nếu đúng như vậy, hãy xóa nội dung của trình giữ chỗ txtHint và thoát khỏi hàm.
Tuy nhiên, nếu trường đầu vào không trống, hãy làm như sau:
- Tạo một đối tượng XMLHttpRequest
- Tạo chức năng được thực thi khi phản hồi của máy chủ đã sẵn sàng
- Gửi yêu cầu tới tệp PHP (gethint.php) trên máy chủ
- Lưu ý rằng tham số q được thêm gethint.php? Q = "+ str
- Biến str chứa nội dung của trường đầu vào
Tệp PHP - "gethint.php"
Tệp PHP kiểm tra một mảng tên và trả về (các) tên tương ứng cho trình duyệt:
<?php
// Array with names
$a[] = "Anna";
$a[] = "Brittany";
$a[] = "Cinderella";
$a[] = "Diana";
$a[] = "Eva";
$a[] = "Fiona";
$a[] = "Gunda";
$a[] = "Hege";
$a[] = "Inga";
$a[] = "Johanna";
$a[] = "Kitty";
$a[] = "Linda";
$a[] = "Nina";
$a[] = "Ophelia";
$a[] = "Petunia";
$a[] = "Amanda";
$a[] = "Raquel";
$a[] = "Cindy";
$a[] = "Doris";
$a[] = "Eve";
$a[] = "Evita";
$a[] = "Sunniva";
$a[] = "Tove";
$a[] = "Unni";
$a[] = "Violet";
$a[] = "Liza";
$a[] = "Elizabeth";
$a[] = "Ellen";
$a[] = "Wenche";
$a[] = "Vicky";
// get the q parameter from URL
$q = $_REQUEST["q"];
$hint = "";
//
lookup all hints from array if $q is different from ""
if ($q !== "")
{
$q = strtolower($q);
$len=strlen($q);
foreach($a as
$name) {
if (stristr($q, substr($name, 0, $len)))
{
if ($hint === "") {
$hint = $name;
} else
{
$hint .= ", $name";
}
}
}
}
// Output "no suggestion" if no hint was found
or output correct values
echo $hint === "" ? "no suggestion" : $hint;
?>