Ultimele tutoriale de dezvoltare web
 

PHP Exemplu - AJAX Sondaj


AJAX Sondaj

Următorul exemplu va demonstra un sondaj de opinie în cazul în care rezultatul este afișat fără reîncărcare.

Iti place PHP si AJAX pana acum?

Da:
Nu:

Exemplul pe înțelesul tuturor - HTML al paginii

Atunci când un utilizator alege o opțiune de mai sus, o funcție numită " getVote() " este executat. Funcția este declanșată de "onclick" eveniment:

<html>
<head>
<script>
function getVote(int) {
  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("poll").innerHTML=xmlhttp.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>

getVote() funcția face următoarele:

  • Crearea unui obiect XMLHttpRequest
  • Creați funcția care urmează să fie executat, atunci când răspunsul server este gata
  • Trimite cererea off la un fișier de pe server
  • Observați că un parametru (vote) se adaugă la adresa URL (cu valoarea da sau nu opțiune)

Fișierul PHP

Pagina pe server numit de JavaScript de mai sus este un fișier PHP numit "poll_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>

Valoarea este trimis de JavaScript, și se întâmplă următoarele:

  1. Ia conținutul "poll_result.txt" fișier
  2. Pune conținutul fișierului în variabile și se adaugă unul la variabila selectată
  3. Scrieți rezultatul la "poll_result.txt" fișier
  4. Ieșire o reprezentare grafică a rezultatului sondaj

Fișierul text

Fișierul text (poll_result.txt) este locul unde am stoca datele din sondaj.

Este stocat ca aceasta:

0||0

Primul număr reprezintă "Yes" voturi, al doilea număr reprezintă "No" voturi.

Note: Amintiți - vă pentru a permite serverul web pentru a edita fișierul text. Nu NOT da acces pentru toată lumea, doar serverul web (PHP) .