XmlHttpRequest et PHP

Marsh Posté le 02-12-2005 à 21:55:14

Bonjour.
J'ai trouvé un tutorial sur ce site http://www.sutekidane.net/blog/creer-un-mo...est-et-php.html

Je veux donc faire de même pour une recherche de nom dans une base de donnée dans un premier temps.

Mon fichier index.php est composé comme ceci

Code :

<script type="text/javascript" src="XHRConnection.js"></script>
<script type="text/javascript">
// Déclaration de la fonction de Callback
// + ----------------------------------------------------------------------------------
// + afficherResultats
// + Affiche ou non le conteneur en fonction du résultat de la recherche
// + ----------------------------------------------------------------------------------
function afficherResultats(obj) {
// Construction des noeuds
var tabResult = obj.responseXML.getElementsByTagName('resultat');
document.getElementById('zoneResultats').innerHTML = '';
if (tabResult.length > 0) {
// On définit la hauteur de la liste en fonction du nombre de rsultats et de la hauteur de ligne
var hauteur = tabResult.length * 22;
with(document.getElementById('zoneResultats').style) {
visibility = 'visible';
height = hauteur + 'px';
};
for (var i = 0; i < tabResult.length; i++) {
resultat = tabResult.item(i);
var egt = document.createElement('li');
var lnk = document.createElement('a');
var texte = document.createTextNode(resultat.getAttribute('titre'));
lnk.appendChild(texte);
lnk.setAttribute('href', resultat.getAttribute('url'));
lnk.setAttribute('title', resultat.getAttribute('titre'));
egt.appendChild(lnk);
document.getElementById('zoneResultats').appendChild(egt);
}
}
else {
document.getElementById('zoneResultats').style.visibility = 'hidden';
}
}
// Déclaration de la fonction qui lance la recherche
function loadData() {
// Création de l'objet
var XHR = new XHRConnection();
XHR.appendData("recherche1", document.getElementById('recherche1').value);
// On soumet la requête
// Signification des paramètres:
// + On indique à l'objet qu'il faut appeler le fichier search.php
// + On utilise la méthode POST, adaptée l'envoi d'information
// + On indique quelle fonction appeler lorsque l'opération a été effectuée
XHR.sendAndLoad("index1.php", "POST", afficherResultats);
}
</script>
<form id="formulaire" action="index1.php" method="post">
<fieldset>
<p>
<label for="recherche1">Saisissez les chaines à rechercher dans le champ de formulaire ci-desous :</label>
<input type="text" name="recherche1" id="recherche1" value="" onkeyup="loadData();" />
</p>
<ul id="zoneResultats" style="visibility: hidden;"></ul>
<p>
Texte à placer pour tester que les réponses s'affichent par dessus... Lorem ipsum ...
</p>
</fieldset>
</form>

et ma page de traitement est composé comme ceci index1.php

Code :

<html>
<body>
<?php
// Déclaration des paramètres de connexion
$host = "localhost";
// Généralement la machine est localhost
// c'est-a-dire la machine sur laquelle le script est hébergé
$user = "root";
$bdd = "mysql";
$passwd = "";
// Connexion au serveur
mysql_connect($host, $user,$passwd) or die("erreur de connexion au serveur" );
mysql_select_db($bdd) or die("erreur de connexion a la base de donnees" );
// Creation et envoi de la requete
$recherche = $_POST['recherche1'];
$query = "SELECT * FROM `nom` WHERE `nom` LIKE '%$recherche%'";
$result = mysql_query($query);
// Recuperation des resultats
while($row = mysql_fetch_row($result)){
echo "$row[0]";
}
// Deconnexion de la base de donnees
mysql_close();
?>
</body>
</html>

J'aimerai faire pour que dès que je tape une lettre du prénom la suite s'affiche comme sur le site cité plus haut.

1) que me manque t'il à faire ?

2) mettre le code javascript dans index.php est ce le bon endroit?

3) A la méthode sendAndLoad faut bien que je lui passe index1.php?

Quand je tape un j dans mon champ recherche par exemple et que j'appuie sur entrée ca m'affiche bien jerome, c'est deja un bon début mais on ne le voit pas s'afficher dans une boite par dessus

Merci d'avance

Reply

Marsh Posté le 02-12-2005 à 21:55:14

Reply

Marsh Posté le 02-12-2005 à 22:36:53

Vois avec http://www.w3.org/TR/REC-html40/interact/scripts.html, essaye pê de changer le onkeyup par onkeydown, onkeypress ou onchange.

Tu peux aussi essaye les demos sur http://script.aculo.us/, ça pourrait t'interresser.

---------------
"L'informatique n'est pas plus la science des ordinateurs que l'astronomie n'est celle des télescopes." Michael R. Fellows & Ian Parberry

Reply

Marsh Posté le 03-12-2005 à 00:53:33

Merci je vais voir ce que je peux faire avec.

Reply

XmlHttpRequest et PHP

Sujets relatifs:

Leave a Replay