Partage
  • Partager sur Facebook
  • Partager sur Twitter

Champ de texte affichant une liste déroulante

Sujet résolu
    21 juin 2017 à 14:17:41

    Bonjour !

    J'aurai besoin d'un champ de formulaire particulier que l'on peut retrouver sur des sites de commerce ou administratifs.

    Prenons l'exemple d'un champ "ville".

    J'aimerais un champ de texte où lorsque je commence à écrire le nom de ma ville cela m'ouvre une liste déroulante avec les différents choix qui pourraient correspondre. Et si je clique sur un des choix de la liste cela renseigne mon champs texte.

    Exemple : je tape "na" et la liste me propose "Nantes", "Nancy"...

    Est ce que cela ne peut se mettre en place qu'avec un code ou existe t-il un objet HTML qui fasse ça nativement ?

    Merci d'avance pour vos lumières =)

    • Partager sur Facebook
    • Partager sur Twitter
      21 juin 2017 à 15:52:25

      Bonjour !

      Tu cherches un système d'autocomplétition. Tu tombes bien car je viens justement de mettre cela en place sur un projet. J'ai utilisé cette librairie : https://jqueryui.com/autocomplete/

      Si tu le souhaites, je peux t'envoyer le code que j'ai utilisé pour faire un Combobox. Je me suis inspiré de la démo qui n'était pas complète.

      • Partager sur Facebook
      • Partager sur Twitter
        21 juin 2017 à 16:27:03

        Bonjour,

        jQueryUI est très bien mais c'est un mastodonte (qui force une dépendance d'une part à lui-même, avec son cortège de CSS, et à jQuery, donc on n'a pas toujours besoin).

        Nativement, on a les datalists ( https://www.w3.org/TR/html/sec-forms.html#the-datalist-element ) mais pour l'instant ce n'est pas très bien implanté ( https://caniuse.com/#feat=datalist ).

        Il existe des libs plus légères, comme Awesomplete : https://leaverou.github.io/awesomplete/ .

        • Partager sur Facebook
        • Partager sur Twitter

        Pas d'aide concernant le code par MP, le forum est là pour ça :)

          21 juin 2017 à 16:51:09

          Wahou, Awesomplete a l'air d'être une petite pétite ! Merci pour cette découverte :)

          Si tu as d'autres questions n'hésites pas :)

          Si mon aide t'a été utile, pourrais-tu répondre à ce questionnaire ? Il n'y a que 5 questions :
          Merci d'avance !

          -
          Edité par Raj Blaze 21 juin 2017 à 16:51:32

          • Partager sur Facebook
          • Partager sur Twitter
            21 juin 2017 à 16:53:52

            Zzorteil > peux-tu éviter de poster ton petit laïus à propos de ton questionnaire ? Le lien est déjà ta signature, tu n'as pas besoin d'en rajouter (et honnêtement, ça fait très "spam").
            • Partager sur Facebook
            • Partager sur Twitter

            Pas d'aide concernant le code par MP, le forum est là pour ça :)

              21 juin 2017 à 16:57:37

              C'est ma façon d'obtenir des réponses, je pense que ce n'est pas trop envahissant :)
              • Partager sur Facebook
              • Partager sur Twitter
                21 juin 2017 à 16:58:59

                Je ne sais pas qu'en pensent les autres, mais moi je trouve ça envahissant, justement.
                • Partager sur Facebook
                • Partager sur Twitter

                Pas d'aide concernant le code par MP, le forum est là pour ça :)

                  22 juin 2017 à 9:46:13

                  Bonjour !

                  J'étais tombé effectivement sur l'objet datalist qui me donne pleinement satisfaction car c'est pour un environnement professionnel constitué uniquement de windows, donc le fait que Safari ne soit pas géré n'est pas un problème !

                  Mais merci beaucoup pour vos bibliothèques et pour caniuse ! =D

                  Concernant le petit off topic questionnaire, oui, que tu proposes tes services de coaching/consultant en signature pourquoi pas, mais là je considère que ça fait un peu trop car ça dilue le sujet principal du topic =)

                  • Partager sur Facebook
                  • Partager sur Twitter
                    22 juin 2017 à 10:13:57

                    Si datalist te convient et correspond à ta cible, c'est parfait !

                    Pense à marquer ton sujet comme résolu si tu considères qu'il l'est :)

                    • Partager sur Facebook
                    • Partager sur Twitter

                    Pas d'aide concernant le code par MP, le forum est là pour ça :)

                      22 juin 2017 à 16:00:58

                      Fait ! 

                      Bonne journée à vous =)

                      • Partager sur Facebook
                      • Partager sur Twitter

                      Champ de texte affichant une liste déroulante

                      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                      × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                      • Editeur
                      • Markdown