PHP - AJAX et PHP
AJAX est utilisé pour créer des applications plus interactives.
Exemple PHP AJAX
L'exemple suivant montre comment une page Web peut communiquer avec un serveur Web pendant qu'un utilisateur saisit des caractères dans un champ de saisie :
Exemple
Start typing a name in the input field below:
Suggestions:
Exemple expliqué
Dans l'exemple ci-dessus, lorsqu'un utilisateur saisit un caractère dans le champ de saisie, une fonction appelée "showHint()" est exécutée.
La fonction est déclenchée par l'événement onkeyup.
Voici le code HTML :
Exemple
<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 action="">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
Explication du code :
Tout d'abord, vérifiez si le champ de saisie est vide (str.length == 0). Si c'est le cas, effacez le contenu de l'espace réservé txtHint et quittez la fonction.
Toutefois, si le champ de saisie n'est pas vide, procédez comme suit :
- Créer un objet XMLHttpRequest
- Créer la fonction à exécuter lorsque la réponse du serveur est prête
- Envoyez la requête vers un fichier PHP (gethint.php) sur le serveur
- Notez que le paramètre q est ajouté à l'url (gethint.php?q="+str)
- Et la variable str contient le contenu du champ de saisie
Le fichier PHP - "gethint.php"
Le fichier PHP vérifie un tableau de noms et renvoie le(s) nom(s) correspondant(s) au navigateur :
<?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;
?>