Imagine que você tem um formulário em seu blog/site onde o usuário deve entrar com o nome de seu estado. Caso você use o datalist, ele vai dar uma listagem dos estados, assim tudo que o usuário vai precisar é selecionar o estado, em vez de ter que digitar cada letra. O legal também é que assim que o usuário começa a digitar, as opções vão ficando menores. Por exemplo, se o usuário digita Bah, o único estado possível seria Bahia, então será a única opção apresentada, ficando mais fácil fazer a seleção.
input - datalist é usado juntamente com o input, esse input deve ter o atributo list com o mesmo valor do id no elemento datalist. Veja um exemplo logo abaixo.
Exemplo com Elemento datalist
Confira o código para tal.
<label for="escolha-estado">Escolha um estado</label>
<input list="lista-estados" id="escolha-estado" name="estados" />
<datalist id="lista-estados">
<option value="São Paulo">
<option value="Minas Gerais">
<option value="Bahia">
<option value="Rio de Janeiro">
<option value="Amazonas">
</datalist>
Fonte: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist
Comentários
Postar um comentário