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

**cari** · 31/07/2006, 12h27

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**Anduriel** · 31/07/2006, 12h46

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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):

<?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é.

**cari** · 31/07/2006, 13h12

cela me renvoit le résultat dans une alerte, mais j'aimerai que ce soit dans le champ même.

**cari** · 31/07/2006, 15h44

j'aimerai avoir la possibilité de selectionné les éléménts

**Anduriel** · 31/07/2006, 16h55

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Après, ça dépend le type de ton champ.

**cari** · 31/07/2006, 17h34

c'est à dire que il ya une liste avec des valeurs qui apparait et la personne peut sélectinner une valeur à l'intérieur

**Anduriel** · 31/07/2006, 17h59

Comme dans la Recherche de ce forum quand tu tappes un pseudo? Ou juste une liste déroulante?

**cari** · 31/07/2006, 18h02

c'est comme dans la recherche lorsque on tape un pseudo, c'est cela!

**Anduriel** · 31/07/2006, 19h19

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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.

**cari** · 01/08/2006, 10h30

ben le div ne s'affiche pas!

Voici son code dans la fonction RempliChamp()

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**cari** · 02/08/2006, 09h44

je n'arrive pas à faire l'affichage dans le div.

**gisele** · 02/08/2006, 21h37

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**cari** · 03/08/2006, 16h45

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:

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