Aide - Recherche - Membres - Calendrier
Version complète : Moteur de recherche en AJAX
Forum Développeur - Administration serveur, programmation et base de données > Programmation > Javascript et AJAX
Cowboy
http://www.sutekidane.net/blog/creer-un-mo...est-et-php.html

J'aimerais bien faire la même chose, mais comme a chaque totorial, ca ne fonctionne pas du premier coup.

Si vous pouviez me donner un coup de main.
j'ai tout mis dans un .rar, il faut décompresser, créer la table, renseigner le mot de passe et lancer la page form.php
http://cowboy.bdd.free.fr/Externe/Recherche AJAX.rar




codejava.js :
CODE
// JavaScript Document
// 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("foo", document.getElementById('foo').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("search.php", "POST", afficherResultats);
}




Config.php
CODE
<?php
    mysql_connect('localhost', 'root', 'MOTDEPASSE');
    mysql_select_db('recherche_ajax');  ?>



form.php
CODE
<?php
    require_once('CConnexion.php');
    require_once('config.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>  <style type="text/css" media="screen">
    #formulaire { padding:5px; margin:10px 0 0 10px; border:1px dashed #999; width:590px; }
    #formulaire fieldset {    border:0; margin:0; padding:0; }
    #formulaire fieldset label {    display:block; }
    #formulaire legend {    margin:0 0 5px; }
    #formulaire p {    display:block; padding:5px 0 0; margin:10px 0 0; width:580px;}
    #zoneResultats {    border:1px solid #000; background-color:#fff; display:block; overflow:auto; margin:0;padding:0; position:absolute; width:400px;}
    #zoneResultats li {    background:#fff;display:block; margin:0; padding:0; }
    #zoneResultats li a{    display:block; padding:2px; text-decoration:none;}
    #zoneResultats li a:hover{    background-color:#ffffc0; }        
    input {    margin:0; }
</style>  </head>
<body>
&lt;script type="text/javascript" src="codejava.js"></script>  <form id="formulaire" action="index.php" method="post">      <fieldset>      <p>           <label for="foo">Saisissez les chaines à rechercher dans le champ de formulaire ci-desous :</label>           <input type="text" name="foo" id="foo" 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>
</body>
</html>


scriptPHP.php
CODE
<?php
require_once('CConnexion.php');
require_once('config.php');  header("Pragma: no-cache");
header("Expires: 0");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-cache, must-revalidate");
header("Content-type: application/xml");  
if(!empty($_REQUEST["foo"]))
{
    $rqListBillet = "SELECT * FROM `recherche_ajax`
                        WHERE `ajax_nom` like '" . $_REQUEST["foo"] . "%'
                        ORDER BY `ajax_nom` DESC";
    $rsListBillet = mysql_query($rqListBillet);
    $xml = "<resultats nb=\"" .  mysql_num_rows($rsListBillet) . "\">";
    if (mysql_num_rows($rsListBillet) > 0)
    {
        while ($billet = mysql_fetch_object($rsListBillet))
        {
            $xml .= "\n<resultat titre=\"" . str_replace('"', "", $billet->titre) . "\" url=\"/blog/" . $billet->url_page . ".html\" />";
        }
    }
}
else
{
    $xml = "<resultats nb=\"0\">";
}
$xml .= "\n</resultats>";
echo utf8_encode($xml);
?>



La table :
CODE
CREATE TABLE `recherche_ajax` (
      `ajax_id` int(11) NOT NULL auto_increment,
      `ajax_date` datetime NOT NULL,
      `ajax_nom` varchar(512) collate utf8_bin NOT NULL,
      `ajax_chaine` longtext collate utf8_bin NOT NULL,
      PRIMARY KEY  (`ajax_id`)
    ) ENGINE=MyISAM  DEFAULT CHARSET=utf8 COLLATE=utf8_bin AUTO_INCREMENT=8;
    
    --      -- Contenu de la table `recherche_ajax`
    --      
    INSERT INTO `recherche_ajax` (`ajax_id`, `ajax_date`, `ajax_nom`, `ajax_chaine`) VALUES      (1, '2007-07-27 12:00:15', 0x4e6f6d31, 0x426c61626c7a6c6971686466206c736a66730d0a6673640d0a660d0a73660d0a730d0a660d0a73
660d0a73640d0a6673646673646673646673660d0a),
    (2, '2007-07-27 12:00:29', 0x4e6f6d32, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173),
    (3, '2007-07-27 12:00:38', 0x416f686f686f68, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173),
    (4, '2007-07-27 12:00:51', 0x4168616861686168, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173),
    (5, '2007-07-27 12:01:01', 0x41686168616861, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173),
    (6, '2007-07-27 12:01:11', 0x4368616d7032, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173),
    (7, '2007-07-27 12:01:21', 0x4d706f6c736471, 0x710d0a73640d0a7173647173640d0a71730d0a64710d0a640d0a710d0a640d0a71730d0a640d0a
71640d0a7173);
*/




Sujet posté ici, mais aucune réponse ...
shazdo
Tout b'abord, bonjour à tous, puis, !!! Help !!!

Idem!!

Je n'arrive pas à le faire fonctionner!
Et j'ai bossé sur celui de Denis Cabasson, mais je n'arrive pas à l'utiliser avec ma base SQL...

Je suis débutant, oui, mais quand même...Ca fait deux semaines de stage que je me bats et je n'arrive qu'à des résultats non aboutis...

Quand j'utilise le tableau fourni avec l'exemple,
pas de soucis mais quand je génère le mien... plus rien...

Exemple très présent sur le net fonctionnant assez bien qui utilise cette liste de mots:
Code
$liste = array("abeille","abricot","acheter","acheteur","adjectif"); (...)


Je veux générer ma liste de mot à partir de ma base SQL,
donc je crée un tableau identique, mais avec un contenu différent:
Code
$result = mysql_query($query);
$i=0;
while($aff=mysql_fetch_row($result)){   $liste[$i] = $aff[0];   $i++;
}


Lorsque je fais un print_r($liste), de la première ou de la seconde,
j'obtiens le même affichage (sauf le contenu, c'est voulu ^^), le même classement, et pourtant... A marche pô...

Code
print_r($tab_du_net); --> Array ( [0] => lafont [1] => abeille [2] => abricot [3] => acheter [4] => acheteur ...)
print_r($ma_tab);     --> Array ( [0] => pellegrin [1] => admin [2] => lafont [3] => martinez [4] => faucher ...)


Lorsque je laisse le tableau d'origine, tout va bien, dés que je veux mettre mes données, c'est la bérésina... Aï aïe aïe, j'y ai déjà passé plusieurs heures sur le problème, à en essayer d'autre, à comprendre... Déjà, il semblerait que ça ne fonctionne que si la base est remplie avec des minuscules pour chaque début de champ, c'est le cas...

Si ça vous intéresse, vous pouvez voir le résultat ou toutes les sources (c'est assez joli smile.gif)
Il y a quatre étapes, la dernière étant la plus jolie (autocomplete-3-2.html).
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'informations, la mise en page et les images, veuillez cliquer ici.
Invision Power Board © 2001-2008 Invision Power Services, Inc.