Ang pangunahing problema na nauugnay sa HTML
<datalist id="browsers"> <option value="Chrome"> <option value="Firefox"> <option value="Internet Explorer"> <option value="Opera"> <option value="Safari"> </datalist>
1. Lumilikha ang code na ito ng HTML element na tinatawag na datalist, na ginagamit upang gumawa ng listahan ng mga opsyon para sa isang input field.
2. Ang datalist ay may id attribute ng "mga browser".
3. Sa loob ng datalist, mayroong limang elemento ng opsyon, bawat isa ay may value attribute na naglalaman ng pangalan ng isang web browser (Chrome, Firefox, Internet Explorer, Opera at Safari).
4. Gagamitin ang mga value na ito bilang mga mungkahi kapag nag-type ang user sa input field na nauugnay sa datalist na ito.
Ano ang tag ng datalist
Ang HTML
Ano ang pagkakaiba sa pagitan ng Datalist at dropdown
Ang Datalist ay isang HTML element na nagbibigay ng listahan ng mga opsyon para sa isang user na mapagpipilian. Ito ay katulad ng isang dropdown na menu, ngunit ang pangunahing pagkakaiba ay pinapayagan nito ang mga user na ipasok ang kanilang sariling mga halaga. Maaaring mag-type ang user sa input field at magbibigay ang datalist ng mga mungkahi batay sa kanilang na-type. Ang dropdown na menu, sa kabilang banda, ay nagpapahintulot lamang sa mga user na pumili mula sa mga paunang natukoy na opsyon. Bukod pa rito, sa isang datalist, maaaring mag-type ang mga user ng anumang halaga na gusto nila kahit na hindi ito nakalista bilang isang opsyon.
Paano gamitin ang datalist sa HTML form
Ang HTML
Upang magamit ang elemento ng datalist, kailangan mo munang lumikha ng HTML form na may isang elemento at bigyan ito ng id attribute. Pagkatapos, maaari kang magdagdag ng elemento ng datalist sa loob ng form at itakda ang attribute ng listahan nito na katumbas ng id ng input field. Sa loob ng datalist, maaari kang magdagdag ng isa o higit pa
Halimbawa: