Ví dụ PHP - AJAX Poll
Cuộc thăm dò ý kiến của AJAX
Ví dụ sau sẽ minh họa một cuộc thăm dò trong đó kết quả được hiển thị mà không cần tải lại.
Bạn có thích PHP và AJAX cho đến nay không?
Giải thích ví dụ - Trang HTML
Khi người dùng chọn một tùy chọn ở trên, một hàm có tên "getVote ()" sẽ được thực thi. Chức năng được kích hoạt bởi sự kiện "onclick":
<html>
<head>
<script>
function getVote(int)
{
var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function() {
if (this.readyState==4 && this.status==200) {
document.getElementById("poll").innerHTML=this.responseText;
}
}
xmlhttp.open("GET","poll_vote.php?vote="+int,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="poll">
<h3>Do you like PHP and AJAX so far?</h3>
<form>
Yes:
<input type="radio" name="vote"
value="0" onclick="getVote(this.value)"><br>
No:
<input type="radio" name="vote"
value="1" onclick="getVote(this.value)">
</form>
</div>
</body>
</html>
Hàm getVote () thực hiện những việc 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 một tệp trên máy chủ
- Lưu ý rằng một tham số (phiếu bầu) được thêm vào URL (với giá trị của tùy chọn có hoặc không)
Tệp PHP
Trang trên máy chủ được gọi bởi JavaScript ở trên là một tệp PHP có tên là "thăm dò ý kiến_vote.php":
<?php
$vote = $_REQUEST['vote'];
//get content of textfile
$filename = "poll_result.txt";
$content = file($filename);
//put content in array
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];
if ($vote == 0) {
$yes = $yes + 1;
}
if ($vote == 1) {
$no = $no + 1;
}
//insert votes to txt file
$insertvote = $yes."||".$no;
$fp = fopen($filename,"w");
fputs($fp,$insertvote);
fclose($fp);
?>
<h2>Result:</h2>
<table>
<tr>
<td>Yes:</td>
<td><img src="poll.gif"
width='<?php echo(100*round($yes/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($yes/($no+$yes),2)); ?>%
</td>
</tr>
<tr>
<td>No:</td>
<td><img src="poll.gif"
width='<?php echo(100*round($no/($no+$yes),2)); ?>'
height='20'>
<?php echo(100*round($no/($no+$yes),2)); ?>%
</td>
</tr>
</table>
Giá trị được gửi từ JavaScript và điều sau sẽ xảy ra:
- Lấy nội dung của tệp "thăm dò ý kiến.txt"
- Đặt nội dung của tệp vào các biến và thêm một vào biến đã chọn
- Ghi kết quả vào tệp "poll_result.txt"
- Đưa ra một biểu diễn đồ họa của kết quả cuộc thăm dò
Tệp văn bản
Tệp văn bản (PoSult.txt) là nơi chúng tôi lưu trữ dữ liệu từ cuộc thăm dò ý kiến.
Nó được lưu trữ như thế này:
0||0
Số đầu tiên đại diện cho phiếu "Có", số thứ hai đại diện cho phiếu "Không".
Lưu ý: Hãy nhớ cho phép máy chủ web của bạn chỉnh sửa tệp văn bản. KHÔNG cấp cho mọi người quyền truy cập, chỉ máy chủ web (PHP).