champ qui crée liste de mots (champ dynamique)

Version imprimable

bonjour, je voudrai que à partir de la saisie de quelques lettres dans un champ, une liste de noms appaisse et permette à l'uitlisateur de sélectionné un nom. Mais j'ai fais plusieurs tests, cela ne réagit pas. Commen faire? Merci.

Voici le champ:
Code:

1 2 3 4 <tr> <td>Déclarant</td> <td> <input type="text" onKeyDown="RempliChamp()" id="declarant" name="declarant" value=""></td> </tr>
Voici la fonction RempliChamp dans javascript:
Code:

1 2 3 4 5 6 7 8 9 10 function RempliChamp() { document.form1.declarant.value= <?php do { echo $row_rsdecl['Nom']; } while ($row_rsdecl = mysql_fetch_assoc($rsdecl)); ?> alert("Ma valeur". $row_rsdecl['Nom']); }
VOici la requete dand php:

Code:

$query_rsdecl = "SELECT * FROM declarants where Nom like '%".$declarant."%' ORDER BY Nom ASC";

Ca sent plus le AJAX. Voila la fonction javascript qui va envoyer en direct le traitement de la requête PHP:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 function RempliChamp() { /* Création de l'instance XMLHTTP (ne pas modifier) */ if (window.XMLHttpRequest) http_request = new XMLHttpRequest(); else if (window.ActiveXObject) http_request = new ActiveXObject("Microsoft.XMLHTTP"); else { alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); return false; } if (!http_request) { alert('Abandon :( Impossible de créer une instance XMLHTTP'); return false; } /* Récupération de la valeur du champ */ data = "lettre=" + document.getElementById("declarant").value; /* Fichier de requête */ http_request.open("POST", "requete.php", true); /* Traitement des résultats */ http_request.onreadystatechange = function() { if (http_request.readyState == 4) { tmp = http_request.responseText; alert(tmp); } } /* Lancement de la requête (ne pas modifier) */ http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); http_request.send(data); }
C'est plutot simple: je récupère la contenance du champ, je l'envois au fichier requête.php pour executer la requête MySQL. Le fichier requete.php ne doit contenir que le code suivant, puisque par la suite je fais un alert de ce que affiche la page (la liste des noms):

Citation:

<?php

   // Connection à la base de donnée
   // Requête
   // le_nom est à remplacer selon ta table
   $query_rsdecl = "SELECT le_nom FROM declarants WHERE Nom LIKE '%".$_POST['lettre']."%' ORDER BY Nom ASC";
   while(list($nom) = mysql_fetch_array($query_rsdec1)) {
        echo $nom."\n";
   }
   
   
?>

Colorez votre code PHP sur les forums grâce à Developpez.com

Par contre je n'ai pas testé.

31/07/2006, 13h12
cari

cela me renvoit le résultat dans une alerte, mais j'aimerai que ce soit dans le champ même.
31/07/2006, 15h44
cari

j'aimerai avoir la possibilité de selectionné les éléménts
31/07/2006, 16h55
Anduriel

Si c'est dans le champ même, au lieu de mettre un alert tu mets par exemple:

Code:

document.getElementById("Ton_Champ").value = tmp;

Après, ça dépend le type de ton champ.
31/07/2006, 17h34
cari

c'est à dire que il ya une liste avec des valeurs qui apparait et la personne peut sélectinner une valeur à l'intérieur
31/07/2006, 17h59
Anduriel

Comme dans la Recherche de ce forum quand tu tappes un pseudo? Ou juste une liste déroulante?
31/07/2006, 18h02
cari

c'est comme dans la recherche lorsque on tape un pseudo, c'est cela!
31/07/2006, 19h19
Anduriel
L'idée c'est d'avoir un div en position absolu et non visible auquel tu attribus un id. Apres la récupération des données dans le code javascript, au lieu du alert, tu remplis ce div avec la variable tmp, et tu l'affiche genre:
Code:

1 2 document.getElementById("Le_Div").value = tmp; document.getElementById("Le_Div").style.display = 'block';
Après, si tu veux que les noms soient cliquables, tu modifies mon code php pour faire un lien qui au OnClick cache le div et insere le mot dans le champ.

ben le div ne s'affiche pas!

Voici son code dans la fonction RempliChamp()

Code:

1
2
3
4
 
document.getElementById("Le_div").style.visibility="visible";
 document.getElementById("Le_div").value = tmp;
document.getElementById("Le_div").style.display = "block";

voici le div:

Code:

1
2
 
<div id="Le_div" style=" position:absolute; visibility:hidden; "  ></div>

02/08/2006, 09h44
cari

:cry: je n'arrive pas à faire l'affichage dans le div.
02/08/2006, 21h37
gisele
Salut, si j'ai bien saisi votre demarche, il me semble que c'est la propriété innerHTML du div qu'il faut affecter du responseText de la requete HTTP.

Il faudrait tenter :
Code:

1 2 3 4 document.getElementById("Le_div").style.visibility="visible"; document.getElementById("Le_div").innerHTML = tmp; document.getElementById("Le_div").style.display = "block";
03/08/2006, 16h45
cari

j'ai pu afficher, seulement l'erreur ci-contre persiste:
ma requete renvoit une erreur quand le champ declarant est vide ou on a rien saisit dans ce dernier. Ce champ declarant, c'est le champ dynamique. Je pensais qu'en le rendant dynamique, lorsqu'on valide le formulaire, sans le remplir au préalable, la requete ne me renverrait plus:

Citation:

Array ( [jour] => [heure] => [NumNat] => [NumClient] => [declarant] => [iddeclarant] => [description] => [envoi] => Valider [MM_insert] => form1 ) Erreur de syntaxe près de 'LIMIT 0, 2' à la ligne 1
10/08/2006, 10h33
cari

Ca pourra peut être servir à un autre membre en recherche

j'ai plutot utilisé ce lien:

qui marche bien d'ailleurs chez moi :D . (avec accès à la bd)
10/08/2006, 10h34
cari

voici le lien:

http://robloche.free.fr/javascript/a...arch/test.html