Autocomplétion sur un champ ville

**bndd24** · 14/04/2016, 15h39

Bonjour,

Voila je cherche à faire un champ ville en autocomplétion (les données, nom des villes, départements etc se trouvant sur une table).

Pour le coté autocomplétion j'utilise la solution fournie par https://jqueryui.com/autocomplete/

dont voici le code :

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
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Autocomplete - Default functionality</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script>
        $(function() {
            var availableTags = [
                "Paris",
                "Bordeaux",
                "Nice",
                "Toulouse",
                "Rueil-Malmaison"
            ];
            $( "#tags" ).autocomplete({
                source: availableTags
            });
        });
    </script>
</head>
<body>
 
<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>
 
 
</body>
</html>

Mais ma question est la suivante : Comment générer la liste des villes de ma table "communes_fr", ma table comporte 36800 communes environ. ou placer le code php exactement ? et surtout de quelle manière car comme j'ai beaucoup de villes, j'ai peur de mal placer mon code php et de bouffer des ressources inutilement. Car je ne veux pas qu'à chaque chargement de la page il me génère les 36000 villes, mais uniquement 10 résultats selon les premières lettres tapée par exemple!

Merci pour votre aide.

**Spartacusply** · 14/04/2016, 16h04

Le mieux ? Utiliser les librairies places et autocomplete proposées par google, franchement c'est top...

Un exemple de comment mettre ça en place : https://www.itx-technologies.com/blo...e-des-adresses

**Celira** · 14/04/2016, 17h02

Sinon, si tu veux faire la recherche dans ta base pour limiter aux villes qui existent dans ton référentiel (ou pour une autre liste), tu peux utiliser la fonctionnalité remote de jqueryUI autocomplete et faire la recherche en PHP via AJAX.

**bndd24** · 16/04/2016, 02h40

Envoyé par Spartacusply

Le mieux ? Utiliser les librairies places et autocomplete proposées par google, franchement c'est top...

Un exemple de comment mettre ça en place : https://www.itx-technologies.com/blo...e-des-adresses

Salut et merci pour le lien mais je n'ai pas besoin de carte google maps, juste un champ autocomplete en menu déroulant.. Est-ce possible avec la solution librairies places ? Car j'ai regardé sur le site + sur la doc Google mais je ne trouve pas d'exemple. En gros, j'ai un formulaire d'inscription et je souhaite que l'utilisateur tape les premières lettres d'une ville de France, sélectionne une ville et récupérer la valeur dès qu'il aura envoyé le formulaire d'inscription.

Envoyé par Celira

Sinon, si tu veux faire la recherche dans ta base pour limiter aux villes qui existent dans ton référentiel (ou pour une autre liste), tu peux utiliser la fonctionnalité remote de jqueryUI autocomplete et faire la recherche en PHP via AJAX.

Salut Celira, oui ton idée m'intéresse. Tu as un exemple concret avec au moins un bout de code à adapter ?

Merci.

**bndd24** · 16/04/2016, 16h37

Je veux juste que la liste des villes soit pris dans ma table.. donc je pense qu'il faut remplacer quelque chose de la ligne 9 à la ligne 22 mais je ne sais pas comment adapter le code..

**Celira** · 18/04/2016, 11h07

Tu peux regarder l'exemple dans la doc de jqueryUi : https://jqueryui.com/autocomplete/#remote et http://api.jqueryui.com/autocomplete/#option-source

Code :

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

1
2
3
4
    $( "#birds" ).autocomplete({
      source: "search.php",
      minLength: 2
    });

Pour la partie PHP, il te faut un script qui prenne un paramètre en entrée et qui fasse une requête en base. Quelque chose du genre :

Code :

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

1
2
3
4
5
6
7
8
9
10
<?php
$results = array();
if (!empty($_GET['term'])) {
	$stmt = $pdo->prepare("SELECT id as value, nom as label FROM OISEAUX where nom LIKE ?");
	$rs = $stmt->execute(array('%'.$_GET['term'].'%'));
	while( $obj = $rs->fetchObject()) {
		$results[] = $obj;
	}
}
echo json_encode($results);

**bndd24** · 18/04/2016, 20h19

j'ai utilisé ton autre code de l'autre sujet^^ TOP!! merci

Autocomplétion sur un champ ville

Langage PHP

Discussions similaires

Partager

Partager