3
all good? Next, I have a select inside an html, see:
<select>
<option selected="selected" value>...</option>
<option>opção 1</option>
<option>opção 2</option>
</select>
I tried using an input to type, rather than selecting the option by clicking. But the input goes sideways, as if it’s not part of the select
My question is; it is really possible to do this, type to select the options, rather than select by clicking?
Thank you in advance.
4
Dude I don’t know if it’s gonna suit you exactly, but sometimes <datalist> attend to you.
Link about the tag: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist
The difference between a <select> and a <datalist> is that in the select vc determines the options that the user is "obliged" to choose between them. Already the datalist vc offers some suggestions to the user, but he is free to type whatever you want, ie it is a list predefined, not a list predetermined as the select.
The
<datalist>element represents the list that represent Predefined options for other Controls.
Translating: The element <datalist> represents the list representing predefined options for other controls.
Official source W3C: https://www.w3.org/wiki/Html/Elements/datalist
Tip: Although not the focus of this question here is another question that was asked here at Stackoverflow and that has more information about these two tags: What is the </datalist tag for>?
Take the example of datalist working.
<input list="browsers" />
<datalist id="browsers">
<option value="Chrome">
<option value="Firefox">
<option value="Internet Explorer">
<option value="Opera">
<option value="Safari">
</datalist>Just what I needed, bro! I’m still a beginner, I was all day trying to research how to put an input into a select, but I didn’t know that there was a tag that did what I needed... thank you so much for the links and the answer, you can be sure I’ll study a lot.
@Mshijo this my young! Study! Especially the official sources, even though it seems to be a more boring text, for sure is the right text! But the main language you have to learn is English, do not forget it, because unfortunately 90% of the content in PT is copied from English and full of "gaps". So always read and draw your own conclusions. Success! []s
@Mshijo this answer has some more information about the Datalist that can help you understand how the tag works and the difference for the Select https://answall.com/questions/197571/pra-que-serva-tag-datalist
I’ve suffered a lot already with autocomplete num input... I didn’t even know this one datalist. ;The
@Lipespry-defolga- In some situations it is very useful and easy to implement :D
Precisely. When needed, I made a "webservice" that returned a JSON, then an ajax request returned this JSON and finally played on . jQuery-UI autocomplete. Workmanship compared to this datalist be populated directly in page rendering. kk
Browser other questions tagged html5 css3
You are not signed in. Login or sign up in order to post.
Learn more about datalist https://answall.com/questions/197571/pra-que-serve-a-tag-datalist/197573#197573
– user60252
@Leocaracciolo already includes the link in the reply! Well complete the material there!
– hugocsl
@Leocaracciolo Thanks! I really didn’t think so, because I was researching in the wrong way. I’m glad you and Hugo helped me. Hugs
– MSHijo