PHP మరియు AJAX వోటింగ్

AJAX వోటింగ్

ఈ AJAX ఉదాహరణలో, పేజీ మళ్ళించకుండా ఫలితాలను పొందగలిగే ఒక వోటింగ్ ప్రోగ్రామ్‌ను మేము ప్రదర్శించబోతున్నాము.

ఇప్పటికే, మీరు PHP మరియు AJAXను ఇష్టపడటారా?

Yes:
No:

ఈ ఉదాహరణలో నాలుగు అంశాలు ఉన్నాయి:

  • హైల్టెక్స్ ఫారమ్
  • JavaScript
  • PHP పేజీ
  • ఫలితాలను నిర్వహించే టెక్స్ట్ ఫైలు

హైల్టెక్స్ ఫారమ్

ఈ హైల్టెక్స్ పేజీ ఉంది. ఇది ఒక సాధారణ హైల్టెక్స్ ఫారమ్‌ను మరియు జావాస్క్రిప్ట్ ఫైల్‌తో కలిసి ఉంటుంది:

<html>
<head>
<script src="poll.js"></script> 
</head>
<body>
<div id="poll">
<h2>Do you like PHP and AJAX so far?</h2>
<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>

ఉదాహరణ వివరణ - HTML ఫారమ్

మీరు చూసినట్లుగా, పైని HTML పేజీలో ఒక సాధారణ HTML ఫారమ్ ఉంది, దానిలో <div> ఎలిమెంట్ రెండు రేడియో బటన్లతో ఉంది.

ఫారమ్ ఈ విధంగా పని చేస్తుంది:

  • వినియోగదారుడు "అవును" లేదా "లేదు" ఎంచుకున్నప్పుడు ఇన్టర్వెంట్ జరుగుతుంది
  • ఇన్టర్వెంట్ జరగించినప్పుడు getVote() ఫంక్షన్ నిర్వహించబడుతుంది
  • ఫారమ్ చుట్టూ ఉన్నది "poll" పేరుతో ప్రస్తావించబడిన <div>. getVote() ఫంక్షన్ నుండి డాటా వెళ్ళిపోతే, ఫారమ్ పునఃస్థాపించబడుతుంది.

టెక్స్ట్ ఫైల్

వోటింగ్ ప్రోగ్రామ్ నుండి డాటా నిల్వ చేయబడుతుంది టెక్స్ట్ ఫైల్ (poll_result.txt).

ఇది ఈ విధంగా ఉంటుంది:

0||0

మొదటి సంఖ్య అనేది "అవును" వోట్లను సూచిస్తుంది, రెండవ సంఖ్య అనేది "లేదు" వోట్లను సూచిస్తుంది.

పరిశీలనలు:మీరు మాత్రమే మీ వెబ్ సర్వర్కును ఈ టెక్స్ట్ ఫైల్ని సవరించడానికి అనుమతించండి. వెబ్ సర్వర్ (PHP) కంటే ఇతరులకు అనుమతించకుండా ఉంచండి.

JavaScript

JavaScript 代码存储在 "poll.js" 中，并于 HTML 文档相连接：

var xmlHttp
function getVote(int)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 } 
var url="poll_vote.php"
url=url+"?vote="+int
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
} 
function stateChanged()} 
{ 
 if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("poll").
 innerHTML=xmlHttp.responseText;
 } 
} 
function GetXmlHttpObject()
{ 
var objXMLHttp=null
if (window.XMLHttpRequest)
 {
 objXMLHttp=new XMLHttpRequest()
 }
else if (window.ActiveXObject)
 {
 objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
 }
return objXMLHttp
}

ఉదాహరణ వివరణలు:

stateChanged() మరియు GetXmlHttpObject ఫంక్షన్లు తో కలిసి PHP మరియు AJAX రెక్వెస్ట్ ఈ సెక్షన్లో ఉన్న ఉదాహరణలు అదే విధంగా ఉన్నాయి

getVote() ఫంక్షన్

వినియోగదారుడు HTML ఫారమ్లో "yes" లేదా "no" ఎంచుకున్నప్పుడు ఈ ఫంక్షన్ అమలు చేస్తుంది

  1. సర్వర్కు పంపబడే యూరి నిర్వచిస్తారు (ఫైలు పేరు)
  2. యూరిలో పరామీతి (vote) జోడిస్తారు, పరామీతిలో ఇన్పుట్ ఫీల్డ్ కంటెంట్ ఉంటుంది
  3. సర్వర్ కొన్ని ఫైల్స్ క్యాచ్ చేయడానికి మాత్రమే మార్పు చేస్తుంది రాండమ్ నంబర్ జోడిస్తారు
  4. GetXmlHttpObject ఫంక్షన్ కాల్ చేసి XMLHTTP ఆబ్జెక్ట్ సృష్టించి, ఆబ్జెక్ట్ ఒక మార్పు జరిగినప్పుడు stateChanged ఫంక్షన్ అమలు చేస్తుంది
  5. ఇచ్చిన యూరిలో పునఃప్రారంభించడానికి XMLHTTP ఆబ్జెక్ట్ ఉపయోగిస్తుంది
  6. సర్వర్కు HTTP రెక్యూస్ట్ పంపుతుంది

PHP పేజీ

జావాస్క్రిప్ట్ కోడ్ ద్వారా కాల్ చేసిన సర్వర్ పేజీ "poll_vote.php" పేరు కలిగిన ఒక సాధారణ 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>

ఉదాహరణ వివరణలు:

ఎంపిక విలువలు JavaScript నుండి వచ్చినప్పుడు ఈ పని జరుగుతుంది:

  1. "poll_result.txt" ఫైలు విషయాన్ని పొందండి
  2. ఫైలు విషయాన్ని వైయామానిక మార్పులకు చేర్చి, ఎంపిక వైయామానికను మొత్తంగా కలపండి
  3. ఫలితాలను "poll_result.txt" ఫైలులో వ్రాయండి
  4. గ్రాఫికల్ వోటింగ్ ఫలితాలను ఉత్పత్తి చేయండి