Autocompletion

bignono1639
Invité n'ayant pas de compte PHPfrance

27 févr. 2021, 02:36

Bonjour,

Je suis coincé dans un développement php, j'aimerais ajouter un champs d'autocomplétions dans un formulaire mais sans succès...

Dans ma page PHP, j'ai un champ qui doit pouvoir s'autocompléter:
<input id = "autocomplete-5">
<div id="empty-message"></div>
Pour l'autocompléter j'utilise le script suivant:
<script>
         $(function() {
            $( "#autocomplete-5" ).autocomplete({
                 source: "nom.php",
                 minLength: 2,
                response: function(event, ui) {
                    // ui.content is the array that's about to be sent to the response callback.
                    if (ui.content.length === 0) {
                         $("#empty-message").text("No results found");
                    } else {
                         $("#empty-message").empty();
                    }
                }
             });
          });
      </script>
Mais j'ai toujours le message "No results found" qui s'affiche.

Lorsque je fais la requête sur "nom.php", j'ai bien un résultat qui s'affiche.

Le code de "nom.php" est le suivant:
$term = $_GET['term'];
$companies = array(
   array( "label" => "JAVA", "value" => "1" ),
   array( "label" => "DATA IMAGE PROCESSING", "value" => "2" ),
   array( "label" => "JAVASCRIPT", "value" => "3" ),
   array( "label" => "DATA MANAGEMENT SYSTEM", "value" => "4" ),
   array( "label" => "COMPUTER PROGRAMMING", "value" => "5" ),
   array( "label" => "SOFTWARE DEVELOPMENT LIFE CYCLE", "value" => "6" ),
   array( "label" => "LEARN COMPUTER FUNDAMENTALS", "value" => "7" ),
   array( "label" => "IMAGE PROCESSING USING JAVA", "value" => "8" ),
   array( "label" => "CLOUD COMPUTING", "value" => "9" ),
   array( "label" => "DATA MINING", "value" => "10" ),
   array( "label" => "DATA WAREHOUSE", "value" => "11" ),
   array( "label" => "E-COMMERCE", "value" => "12" ),
   array( "label" => "DBMS", "value" => "13" ),
   array( "label" => "HTTP", "value" => "14" )
	
);

$result = array();
foreach ($companies as $company) {
   $companyLabel = $company[ "label" ];

   if ( strpos( strtoupper($companyLabel), strtoupper($term) )!== false ) {
      array_push( $result, $companyLabel );
   }
}

echo json_encode( $result );

Mammouth du PHP | 2703 Messages

27 févr. 2021, 13:07

quelle est l'url appelé par le javascript, visible dans la console ? le résultat retourné par le php avec cette url est-il celui attendu ?

Avatar du membre
Mammouth du PHP | 1564 Messages

27 févr. 2021, 14:28

regarde via un console.log ce que te retourne la page nom.php

console.log(ui.content);

Ton strtoupper($companyLabel) est inutile car tes label sont déjà en MAJUSCULES:
if ( strpos( strtoupper($companyLabel), strtoupper($term) )!== false ) {
if ( strpos( $companyLabel, strtoupper($term) )!== false ) {

bignono1639
Invité n'ayant pas de compte PHPfrance

28 févr. 2021, 17:46

Justement c'est vide...

Avatar du membre
Mammouth du PHP | 1564 Messages

28 févr. 2021, 18:21

place au débug!

met un simple echo "Bonjour"; dans ton nom.php pour voir ce que retourne ui.content

bignono1639
Invité n'ayant pas de compte PHPfrance

28 févr. 2021, 18:45

Ca m'affiche []

Avatar du membre
Mammouth du PHP | 1564 Messages

28 févr. 2021, 18:51

console log de ui retourne quoi ?

Avatar du membre
Modérateur PHPfrance
Modérateur PHPfrance | 10684 Messages

01 mars 2021, 11:41

Salutations !

Dans ton code, à quel moment de ton appel ajax à ton script nom.php pour obtenir une liste de résultats, est-ce que tu transmets une valeur pour terme ?

Vérifie que ton script d'autocomplete envoi bien cette valeur (et qui plus est en get), pour t'assurer qu'elle sera bien traitée côté php.

(Dans la console du navigateur, il y a généralement un onglet réseau/network qui te permet de voir les informations envoyées et reçues... tu peux ainsi t'assurer de l'appel que fais ton script au serveur quand tu saisis des caractères dans ton champ)
Ce n'est pas en améliorant la bougie que l'on a inventé l'ampoule...

Avatar du membre
Mammouth du PHP | 1564 Messages

01 mars 2021, 12:09

Je connais pas beaucoup l'autocompletion, je suppose que c'est avec jQuery UI.

Tu as la doc ici: https://api.jqueryui.com/autocomplete/#event-response

Ton problème semble venir de ton option "source" que tu n'utilise pas comme il faut: https://api.jqueryui.com/autocomplete/#option-source

J'ai regardé un de mes codes; je lance l'autocomplete et je donne une fonction à source où jy place un $.ajax(...) à l'intérieur ;)

bignono1639
Invité n'ayant pas de compte PHPfrance

01 mars 2021, 20:58

Bonjour,

Le console.log(ui) me retourne "{content: Array(0)}"

Et lorsque je suis dans l'onglet "Network" j'ai une ligne comme ceci qui apparaît
nom.php?term=JA

où JA correspond à ce que j'ai tapé

Mammouth du PHP | 2703 Messages

01 mars 2021, 21:09

l'ouverture de l'url nom.php?term=JA dans un nouvel onglet affiche bien un résultat ?

bignono1639
Invité n'ayant pas de compte PHPfrance

02 mars 2021, 03:06

Oui ceci:

["JAVA","JAVASCRIPT","IMAGE PROCESSING USING JAVA"]

Mammouth du PHP | 2703 Messages

02 mars 2021, 12:42

if (ui.content.length === 0) {
$("#empty-message").text("No results found");
} else {
$("#empty-message").empty();
}

que se passe-t-il dans la page ? cela affiche "No results found" ? ou il ne se passe rien (ce qui est normal vu le traitement effectué quand il y a un résultat) ?

bignono1639
Invité n'ayant pas de compte PHPfrance

02 mars 2021, 12:55

"No result found" s'affiche

Avatar du membre
Mammouth du PHP | 1564 Messages

02 mars 2021, 13:01

source: "nom.php", <- ne fonctionnera pas, j'ai mis le lien vers la source plus haut (prend en compte un tableau, une chaine ou une fonction, pas une URL (AJAX (post/get) oui en revanche mais pas "source")