PHP এবং AJAX ভোট গ্রহণ
AJAX ব্যবহার করে ভোট গ্রহণ
এই অধ্যায়ে আমরা দেখবো AJAX ব্যবহার করে কিভাবে একটি ডায়ানামিক ভোট গ্রহণ সিস্টেম তৈরি করা যায়।
এক্ষেত্রেও আমরা পূর্বের ন্যায় কোডসমূহকে তিন ভাগে বিভক্ত করবোঃ এইচটিএমএল কোড, জাভাস্ক্রিপ্ট(AJAX) কোড এবং পিএইচপি কোড। সুতরাং দেরি না করে চলুন কোডিং করা শুরু করি।
<!DOCTYPE html>
<html>
<head>
<title>পিএইচপি এবং এজ্যাক্স ব্যবহার করে ভোট গ্রহণ</title>
</head>
<body>
<div id="poll">
<h3>আমাদের ওয়েব-সাইটটি কি আপনার পছন্দ?</h3>
<form>
হ্যাঃ
<input type="radio" name="poll_vote"
value="0" onclick="vote(this.value)">
নাঃ
<input type="radio" name="poll_vote"
value="1" onclick="vote(this.value)">
</form>
</div>
</body>
</html>
উপরের উদাহরণে ইউজার যখন কোনো একটি রেডিও বাটন সিলেক্ট করবে, তখন vote() ফাংশনটি সম্পাদিত হবে এবং ভোটের ফলাফল প্রদর্শিত হবে। onclick ইভেন্ট এর মাধ্যমে এই ফাংশনটি সম্পাদিত হয়।
<script>
function vote(integer) {
if (window.XMLHttpRequest) {
request=new XMLHttpRequest();
} else {
request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.onreadystatechange = function() {
if (request.readyState == 4 && request.status == 200) {
document.getElementById("poll").innerHTML = request.responseText;
}
}
request.open("GET","poll_vote.php?poll_vote="+integer,true);
request.send();
}
</script>কোডের ব্যাখ্যাঃ
যেকোন একটি রেডিও বাটন সিলেক্ট করলে vote() ফাংশনটি সম্পাদিত হয়।
vote() ফাংশনের মাধ্যমে নিম্নোক্ত প্রক্রিয়াসমূহ সম্পন্ন হয়।
- একটি XMLHttpRequest অবজেক্ট তৈরি করবে।
- কার্যসম্পাদনের জন্য সার্ভার প্রস্তুত হলে এটি একটি ফাংশন তৈরি করবে।
- সার্ভারে অবস্থিত "poll_vote.php" ফাইলে একটি অনুরোধ পাঠাবে।
- লক্ষ্য করুন আমরা "poll_vote.php" ফাইলের সাথে একটি প্যারামিটার poll_vote যুক্ত করেছি যা সার্ভারে একটি integer ভ্যারিয়েবল পাঠায়।
- integer ভ্যারিয়েবলটি রেডিও বাটনের ভ্যালু ধারন করে।
পিএইচপি ফাইল
উপরের জাভাস্ক্রিপ্ট কোড এর মাধ্যমে এই পিএইচপি ফাইল(poll_vote.php) এর সাথে যোগাযোগ সৃষ্টি করা হয়।
<?php
$poll_vote = $_REQUEST['poll_vote'];
// টেক্সট ফাইলের কন্টেন গুলো ধারন করে
$textfile = "poll_result.txt";
$content = file($textfile);
// প্রাপ্ত ফলাফল গুলোকে অ্যারের মধ্যে রাখবে
$array = explode("||", $content[0]);
$yes = $array[0];
$no = $array[1];
if ($poll_vote == 0) {
$yes = $yes + 1;
}
if ($poll_vote == 1) {
$no = $no + 1;
}
// টেক্সট ফাইলে ভোট(poll_votes) জমা দেওয়া
$insertpoll_vote = $yes."||".$no;
$fp = fopen($textfile,"w");
fputs($fp,$insertpoll_vote);
fclose($fp);
?>
<table>
<tr>
<td>হ্যাঁঃ</td>
<td>
<img src="poll_image1.gif" width='NAN'height='20'>
<?php echo(100*round($yes/($no+$yes),2)); ?>%
</td>
</tr>
<tr>
<td>নাঃ</td>
<td>
<img src="poll_image2.gif" width='NAN'height='20'>
<?php echo(100*round($no/($no+$yes),2)); ?>%
</td>
</tr>
</table>জাভাস্ক্রিপ্ট যখন ভোট গ্রহনের জন্য পিএইচপি ফাইলে অনুরোধ পাঠায় তখন নিম্নোক্ত প্রক্রিয়াসমূহ সম্পন্ন হয়ঃ
- প্রথমেই AJAX কর্তৃক পাঠানো প্যারামিটার গ্রহণ করবে।
- "poll_result.txt" ফাইল এর কন্টেন্ট $textfile ভ্যারিয়েবলে জমা হয়।
- $textfile এর কন্টেন্ট এর জন্য একটি array তৈরি করা হয় এবং নির্বাচিত ভ্যারিয়েবলে এক যোগ করা হয়।
- "poll_result.txt" ফাইলটি আপডেট হয়।
- চিত্রসহকারে ফলাফল প্রদর্শন করানো হয়।
টেক্সট ফাইল
"poll_result.txt" ফাইলের মধ্যে ভোট জমা পড়বে এবং নিম্নের ফরম্যাটে সংরক্ষিত হবেঃ
0||0প্রথম সংখ্যাটি "হ্যা" ভোট কে বুঝায় এবং দ্বিতীয় সংখ্যাটি "না" ভোটকে বুঝায়।
সতর্কতাঃ ওয়েব সার্ভার ব্যাতিত অন্য কাউকে টেক্সট ফাইল এডিট করার অ্যাক্সেস দেয়া উচিৎ নয়!
আপনি উপরের উদাহরণের এইচটিএমএল এবং জাভাস্ক্রিপ্ট কোড গুলোর সমন্বয়ে একটি ফাইল এবং পিএইচপি কোডগুলোর জন্য একটি ফাইল তৈর করে Ajax সম্বলিত এইচটিএমএল ফাইলটি রান করালে বাউজারে নিম্নের ন্যায় ফলাফল দেখবেন।
AJAX এর মাধ্যমে ভোট এর ফলাফল দেখার জন্য "হ্যাঁ" অথবা "না" বাটন সিলেক্ট করুনঃ
