Discussion :

[leTiDevDu54]

Bonjour à tous,

j'ai suivit le tutoriel à l'adresse suivante :
http://dcabasson.developpez.com/arti...ion-pas-a-pas/, et j'ai vu que le créateur de ce tutoriel disait que son auto-complétion ne pouvait pas fonctionner si il y avait plusieurs éléments à auto-compléter sur une même page, j'aurai voulu des pistes sur ce qu'il y avait à modifier principalement.

Merci d'avance

[Nicolas Esprit]

Bonjour,

Je ne vois pas trop où est le problème à avoir plusieurs champs avec AutoCompletion sur une même page.

Si tu utilises ce tuto pour apprendre un peu plus ajax c'est bien. Mais si tu veux aller vite, tu regardes du côté de l'AutoCompleteExtender de l'AjaxControlToolkit, tu gagneras beaucoup de temps.

En espérant t'avoir aidé.

[E.Bzz]

Bonjour,

j'aurai voulu des pistes sur ce qu'il y avait à modifier principalement.

principalement (mais tout dépend de l'adaptation que tu en fais) :

• l'id du champ ajouté ainsi que des autres éléments impactés (input hidden, form ...).
• le nom de certaines variables (y compris xhr si des auto-completions risquent d'être simultanées) s'il y a un risque de conflit.
• rendre paramétrables les fonctions faisant référence aux objets "en dur"

A+

[zonzon25]

Bonjour, j'ai réussi a modifier le code pour pouvoir faire plusieurs autocompletion sur une même page.

Tout d'abord sur chaque input:

Code :

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

onclick="initAutoComplete(document.getElementById('formulaire'),document.getElementById('etablissement2'),document.getElementById('bouton-submit'),'champ','table','champ2') "

Champ, table et champ2 me permette d'aller chercher mes valeurs dans la base de donnée :

Code :

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

1
2
3
4
5
6
7
8
9
var champ_sortie=null;         
var table_sortie=null;
var champ2_sortie=null; 
function initAutoComplete(form,field,submit,champ,table,champ2){
  champ_sortie=champ;
  table_sortie=table;  // je met les parametres de initAutoComplete dans des variables, pour les reutiliser en les'envoyant dans l adresse
  champ2_sortie=champ2;
...
}

Dans la page option.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
 
	 $champ = $_GET['champ'];
	 $table = $_GET['table'];
	 $champ2 = $_GET['champ2'];
 
 
    $MAX_RETURN = 10;
    $i = 0;		
 
	$suggest_query = pg_query("SELECT $champ FROM $table WHERE $champ2 LIKE '$debut%' LIMIT 10");	
	$id=0;
	while($suggest = pg_fetch_row($suggest_query)) {
		$liste[$id]= $suggest[0];		 
		$id++;
	}	
 
    foreach ($liste as $element) {
        if ($i<$MAX_RETURN && substr($element, 0, strlen($debut))==$debut) {
            echo(utf8_encode("<option>".$element."</option>"));
 
            $i++;
        }
    }
 
echo("</options>");

Que j'appel comme cela dans la fonction callSuggestions

Code :

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

    _xmlHttp.open("GET",_adresseRecherche+"?debut="+valeur+"&champ="+champ_sortie+"&table="+table_sortie+"&champ2="+champ2_sortie,true);

ENsuite desactivation du bonton submit dans divOnMouse

Code :

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

1
2
3
4
var divOnMouseDown=function(){
  _inputField.value=getSuggestion(this);
  //  _documentForm.submit()   desactivation du click submit
};