Brug af datalist-elementet til foruddefinerede inputforslag

<datalist>-elementet i HTML bruges til at oprette en foruddefineret liste af valgmuligheder til et <input>-element. Det giver brugeren mulighed for at vælge en mulighed fra listen, samtidig med at de også kan indtaste deres egen værdi, hvis de ønsker det. Listen med foruddefinerede værdier forbliver skjult, indtil brugeren begynder at skrive i det tilknyttede tekstfelt. <datalist> parres med et id-attribut, og <input> forbindes til det ved hjælp af list-attributten.

<datalist>-elementet er nyttigt, når du vil give brugbare forslag uden at begrænse brugerne til et fast sæt valgmuligheder.

Eksempel

Når brugeren skriver i feltet, viser browseren de foruddefinerede kategorier. Hvis ingen passer, kan brugeren stadig indtaste deres egen værdi.

• <label for="category">: beskriver formålet med inputfeltet;
• <input type="text" name="category" id="category" list="categories"/>: et tekstfelt, der viser forslag fra en tilknyttet dataliste;
• <datalist id="categories">: indeholder foruddefinerede muligheder, der vises som forslag under indtastning;
• <option value="...">: repræsenterer hvert foreslået element.