Input text à valeurs multiples et datalist

Bonjour à tous,

Je travaille sur un petit module de recherche documentaire, composé d'un simple input text dans lequel l'utilisateur peut venir taper des mots clefs, s'il souhaite en rentrer plusieurs il peut en prenant soin de séparer les mots clefs par un ";"

Dynamiquement, je charge une datalist proposant des suggestions de mots clefs à l'utilisateur, en fonction de ce qu'il tape.

Mon soucis n'est pas de charger dynamiquement la liste, je sais ne prendre que le dernier mot clef saisie et alimenter la liste en conséquence, ce que je ne sais pas c'est afficher la liste a partir du deuxième mot.

Regardez cet exemple, lorsque l'input est de type="email", si l'on saisie une première adresse, il suffit de taper une virgule pour que la liste s'affiche à nouveau.

J'aimerais réaliser cela mais avec un input de type="text", avant de partir sur un développement custom, je voudrais savoir s'il existe un moyen simple de réaliser cela ou peut-être une façon de faire auquel je n'aurais pas pensé ? :mouarf:

J'ai bien demandé à Google mais il n'a pas su me dire :calim2:

:salut:

Code:

---

1 2 3 4 5 6 7

<input type="email" list="emails" multiple> <datalist id="emails"> <option value="first@example.com"> <option value="second@example.com"> <option value="third@example.com"> <option value="last@example.com"> </datalist>

---

Citation:

---

Envoyé par https://developer.mozilla.org/fr/docs/Web/HTML/Element/input

multiple

Cet attribut booléen indique que l'utilisateur peut saisir plus d'une valeur. Cet attribut est appliqué lorsque type vaut email ou file, sinon, il est ignoré.

---

Oui cette partie là de l'attribut multiple ne m'a pas échappé, seulement moi j'aimerais faire cela sans être restreint au type "email". Pouvoir le faire avec un type text ou search.

J'ai bien essayé de tricher avec le type email mais je n'ai pas réussi, y a-t-il moyen de surcharger le template que doit avoir la chaine ? Car si la chaine saisie n'est pas typée something@domain.com, cela ne fonctionne pas...