Bonjour,
J'ai actuellement un formulaire de recherche qui grâce à Ajax.Autocompleter propose une autocompletion (liste de contributeurs de livres) :
Le fichier JavaScript :
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 <form action="liste_essai_pagination.php" method="get"id="recherche"> <div> <input class="inputRecherche"type="text" id="contributeurs" name="clesearch" value="<?php if(isset($_GET['clesearch'])) echo $_GET['clesearch']; ?>"/> </div> <div id="contributeurs_propositions" class="autocomplete"></div> <div> <input type="submit" name="ok" class="bt_ok "value="Ok !" </div> </form> <script type="text/javascript"> init(); </script>
Le script serveur :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14 var init = function () { // Instanciation de la classe Autocompleter, pour le champ de saisie "departement" new Ajax.Autocompleter( "contributeurs", // id du champ de formulaire "contributeurs_propositions", // id de l'élément utilisé pour les propositions "autocompleter-exemple-1-serveur.php", // URL du script côté serveur { paramName: 'clesearch', // Nom du paramètre reçu par le script serveur method:'get', minChars: 1 // Nombre de caractères minimum avant que des appels serveur ne soient effectués }); }; // init
Le système d'autocompletion fonctionne très bien. Mais j'éprouve des difficultés à "dupliquer" ce système en le rattachant à un 2nd formulaire (liste des titres de livres) :
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
33
34
35
36
37 if(isset($_GET['clesearch'])) { header('Content-type: text/html; charset=UTF-8'); // on inclut la connexion mysql_connect('localhost', 'root', ''); mysql_select_db('db'); mysql_set_charset( 'utf8' );//ajouté pour gestion des accents // on fait la requête $sql = "SELECT nom_contributeur, prenom_contributeur FROM contributeurs WHERE nom_contributeur LIKE '".mysql_real_escape_string($_GET['clesearch'])."%'"; $req = mysql_query($sql); $i = 0; echo '<ul>'; // on boucle sur tous les éléments while($autoCompletion = mysql_fetch_assoc($req)){ echo ' <li >'.$autoCompletion['nom_contributeur'].'<br/><span class="informal">'.$autoCompletion['prenom_contributeur'].'</span></li>' ; // on s'arrête sil y en a trop if (++$i >= 10) die('<li>...</li></ul>'); } echo '</ul>'; die(); }
J'ai crée un second code JavaScript sur le modèle du premier ainsi qu'un second fichier script serveur (en les adaptant au 2nd formulaire). Je me retrouve donc avec 2 fichiers JavaScript dans mon Head. Mais je n'arrive pas à faire fonctionner le système d'autocompletion sur les 2 formulaires, seul le 1er fonctionne.
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 <form action="liste_essai_pagination.php" method="get"id="recherche"> <div> <input class="inputRecherche"type="text" id="titres" name="clesearch_titre" value="<?php if(isset($_GET['clesearch_titre'])) echo $_GET['clesearch_titre']; ?>"/> </div> </div> <div id="titres_propositions" class="autocomplete"></div> <div> <input type="submit" name="ok" class="bt_oktitre"value="go titre !" </div> </form> <script type="text/javascript"> init(); </script>
Savez-vous comment adapter mon code JavaScript pour gérer 2 formulaires en autocompletion ? Merci d'avance.
Partager