Separer résultat autocomplete

Résolu/Fermé

gismin - 8 févr. 2021 à 10:40
gismin - 9 févr. 2021 à 16:18

Bonjour,
Dans mon code ci-dessous j'obtiens avec jquery autocompllete une ville et son code postal :
$(function(){
$('#codep').autocomplete({
minLength: 2,
source : 'completion.php'
});
$('#codep').val();
});

Je voudrais séparer du résultat la ville et l'afficher dans un input id="ville".
Comment dois je faire ?
Merci de vos réponses.

A voir également:

Separer résultat autocomplete
Séparer pdf - Guide
Lexer resultat - Télécharger - Sport
Évariste souhaite télécharger le logiciel libreoffice depuis le site de son éditeur. sélectionnez le résultat de recherche sur lequel il doit cliquer. ✓ - Forum Windows Vista
Évariste souhaite télécharger le logiciel 7-zip depuis le site de son éditeur. sélectionnez le résultat de recherche sur lequel il doit cliquer. - Forum Compression
Évariste souhaite télécharger le logiciel mozilla firefox depuis le site de son éditeur. sélectionnez le résultat de recherche sur lequel il doit cliquer. ✓ - Forum Microsoft Edge / Internet Explorer

8 réponses

Réponse 1 / 8

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
Modifié le 8 févr. 2021 à 11:27

BOnjour,

Déjà, lorsque tu postes du code sur le forum, merci d'utiliser les balises de code
Explications (à lire entièrement !! ) disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

Ensuite, il faut que tu utilises la méthode "select"

$('#codep').autocomplete({
  minLength: 2,
  source : 'completion.php' ,
  select: function( event, ui ) {  
         $('tonchamp1').val( ui.item.label ); //
         $("tonchamp2").val( ui.item.value ); //
        return false;
  }
});

Whismeril Messages postés 19029 Date d'inscription mardi 11 mars 2003 Statut Contributeur Dernière intervention 26 avril 2024 931
8 févr. 2021 à 11:27

Hello, t'as oublié de colle lien ;)
https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > Whismeril Messages postés 19029 Date d'inscription mardi 11 mars 2003 Statut Contributeur Dernière intervention 26 avril 2024
8 févr. 2021 à 11:29

j'ai été plus rapide que toi de quelques milli secondes... :-)

gismin
8 févr. 2021 à 12:03

Pardon mais je comprends rien.
J'ai 2 input text id"codepl" et id"ville".
Avec "autocomplete" (ci-dessous) vers mon fichier "completion.php" j'ai en retour quand je rentre un code postal des 'villes+ code postal' qui s'affichent das mon input "codep" puis je clique sur une proposition et cela s'affiche donc dans cet input.
Ce que je cherche à faire c de séparer la ville et de l'afficher aussi dans mon input id="ville".

 $(function(){   
$('#codep').autocomplete({    
  minLength: 2,
    source : 'completion.php' 
});                                              
 $('#codep').val();   
  
});

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > gismin
8 févr. 2021 à 13:15

Je t'ai donne le code qui va bien côté js
Faudrait, par contre nous montrer le code php de ton fichier completion.php'
La réponse devant contenir un champ "label" et un champ"value"

Réponse 2 / 8

gismin
8 févr. 2021 à 14:13

Ca marche pas.

 $(function(){    
$('#codep').autocomplete({    
  minLength: 2,
    source : 'completion.php' 
});                                              
 select: function( event, ui ) {  
         $('codep').val( ui.item.label ); //
         $("ville").val( ui.item.value ); //
        return false;
});

Mon fichier PHP lui marche puisque je reçois la demande et l'affiche dans mon input codep.

$requete = $bdd->prepare('SELECT codep, ville_nom FROM villes_france_free WHERE codep LIKE :term ORDER BY ville_nom'); // j'effectue ma requête SQL grâce au mot-clé LIKE
 
$requete->execute(array('term' => $term.'%')); 
 
$array = array(); // on créé le tableau 
 
while($donnee = $requete->fetch()) // on effectue une boucle pour obtenir les données 
{ 
    array_push  ($array,($donnee['ville_nom']).'  '.($donnee['codep']))   ;// et on ajoute celles-ci à notre tableau
 }
 
 
echo json_encode($array); // il n'y a plus qu'à convertir en JSON 
  
 }

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
Modifié le 8 févr. 2021 à 14:34

while($donnee = $requete->fetch()) // on effectue une boucle pour obtenir les données 
{ 
$array[] = array('label'=>$donnee['ville_nom'] , 'value'=>$donnee['codep']); 
 }
 
 
echo json_encode($array); // il n'y a plus qu'à convertir en JSON

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650 > jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024
8 févr. 2021 à 14:45

ah, et il ne faut pas oublier de bien spécifier tes champs dans le JS ....
Tu utilises leur ID ? dans ce cas il faut préfixer par un dièse
Ou un class ? dans ce cas là, il faut préfixer par un point

Si id :

  $('#codep').val( ui.item.label ); //
   $("#ville").val( ui.item.value ); //

Réponse 3 / 8

gismin
8 févr. 2021 à 17:07

C toujours pas concluant avec:

$('#codep').autocomplete({
  minLength: 2,
  source : 'completion.php' ,
  
    select: function( event, ui ) {  
         $('#codep').val( ui.item.value );  
         $("#ville").val( ui.item.label );
        return false;
    }
});


while($donnee = $requete->fetch()) 
{ 
 $array[] = array('label'=>$donnee['ville_nom'] , 'value'=>$donnee['codep']);  
 
 
echo json_encode($array); // il n'y a plus qu'à convertir en JSON 
  
 }

Je ne crois qu'il y ait des erreurs de syntaxes

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
8 févr. 2021 à 17:31

Où as tu vu que le json_encode devait se trouver dans la boucle ?

Exemple

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    .<meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Autocomplete </title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  </head>

  <body>
  
  <input  type="text" id="codep">
  <input  type="text" id="ville">
  <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
    $('#codep').autocomplete({    
      minLength: 2,
      source : 'completion.php' ,                                  
      select: function( event, ui ) {  
               $('#codep').val( ui.item.label ); //
               $("#ville").val( ui.item.value ); //
              return false;
            }
    });
  </script>
  </body>
</html>

et le fichier php (juste pour exemple )

<?php

//exemple

$res = array();

$res[] = array("value"=>10000,"label"=>"v1");
$res[] = array("value"=>10000,"label"=>"v3");
$res[] = array("value"=>10000,"label"=>"v2");

echo json_encode($res);
exit;

Réponse 4 / 8

gismin
8 févr. 2021 à 18:29

oui j'ai fait une erreur de transcription mais chez moi 'json_encode ' est après la boucle (plus haut j'ai posté correctement).

Mon fichier PHP marche puisqu'il me renvoie: ville et code postal et avec mon autocomplete original j'ai bien ces 2 valeurs qui s'inscrivent dans mon input "codep" quand j'en choisis et clique.
Comment reprendre "simplement" ces 2 valeurs et en afficher la ville dans l'input 'ville' ?
Ton code autocomplete semble logique mais je ne sais pourquoi il ne marche pas.

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
8 févr. 2021 à 18:33

Il fonctionne parfaitement...
As tu pris le temps, au moins de le tester ?

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 8

gismin
8 févr. 2021 à 18:53

peux tu me donner ton fichier completion.php complet ?

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
8 févr. 2021 à 19:09

Ben c'est juste le code PHP que je t'ai donné

Réponse 6 / 8

gismin
8 févr. 2021 à 21:22

Bon, ça marche ! j'ai repris ton code HTML en entier alors qu'avant qu'en partie seulement et avec dans complete.php :

while($donnee = $requete->fetch()) // on effectue une boucle pour obtenir les données 
{ 
     $array[] = array('label'=>$donnee['ville_nom'] , 'value'=>$donnee['codep']);   
 }

.

Pour ta 2eme variante PHP j'ai pas encore bien saisie pour l'insérer à la suite de ma requête MYSQL.

En tout cas merci beaucoup et de partager tes compétences.

Réponse 7 / 8

gismin
9 févr. 2021 à 12:58

Bonjour, je reviens sur le code autocomplete.
Le code de Jordan45 n'affiche que les codes postaux dans codep sans les villes correspondantes. Après divers essais c mieux avec les codes suivants:

 
$('#codep').autocomplete({    
      minLength: 2,
      source : 'completion2.php' ,                                  
      select: function( event, ui ) {  
                $('#codep').val(); 
               $("#ville").val( ui.item.value); //
              return false;
			  }
});

 include ('connect.php');
 
  if(isset($_GET['term'])) { 
 $term = htmlspecialchars($_GET['term']); 
  
$requete = $bdd->prepare('SELECT codep, ville_nom FROM villes_france_free WHERE codep LIKE :term ORDER BY ville_nom'); // j'effectue ma requête SQL grâce au mot-clé LIKE
 
$requete->execute(array('term' => $term.'%')); 
 
$array = array(); // on créé le tableau 
 
while($donnee = $requete->fetch()) // on effectue une boucle pour obtenir les données 
{ 
 $array[] = array('value'=>$donnee['ville_nom'] , 'label'=>$donnee['codep']);    // et on ajoute celles-ci à notre tableau
 }
  
echo json_encode($array); // il n'y a plus qu'à convertir en JSON 
  
 }

Le seul petit problème (même si c pas trop génant) c qu'il affiche dans '#ville' le code postal à la suite de la ville . Je ne sais pas ce qu'il faut mettre comme valeur dans "$("#ville").val( ui.item.value);" pour n'afficher que la ville. J'ai essayé au pif avec $array[0] sans résultat.

Réponse 8 / 8

gismin
9 févr. 2021 à 16:18

Enfin j'ai trouvé sur un forum "openClassroom" la solution:

 $('#codep').autocomplete({    
      minLength: 2,
      source : 'completion.php' ,                                  
      select: function( event, ui ) {  
	           let valeurs = ui.item.value.split(' - ');
                $('#codep').val( valeurs[1] );
                $('#ville').val( valeurs[0] ); 
	   return false;
	  }
    });

Problème résolu.

Discussions similaires

Récupérer un résultat selon la date d'aujourd'hui

Obtenir un affichage décimal sur ma Casio fx 92

Avoir les résultats du dernier tirage du loto :)

Bonjour,j'ai besoin des résultats d'aujourd'hui vendredi 29 octobre 2021 de 17h

generer toutes les combinaisons du loto premier bet 5/90 et 4/52 .

Discussions similaires

Newsletters