HTML <datalist>

<datalist> tegi oldindan belgilangan ma'lumotlarni chiqarish uchun ishlatiladi. Ko'pincha <input> tegi bilan birga qo'llaniladi. Hozir qaysi holatda ishlatilinishini tushunishga harakat qilib ko'ramiz. Demak, <datalist> tegini input ichida qo'llash orqali biz ba'zida tez yozishni ham ta'minlashimiz mumkin. Yani sizning saytingizda qidiruv ( search ) qismi mavjud. O'sha search inputining ustiga bosilganda <datalist> tegi ichiga yozilgan variantlar foydalanuvchiga taqdim qilinadi.

Amaliyotda sinab ko'ramiz.

<html>
<body>

<h1>Datalist elementi</h1>

<form action="/action_page.php" method="get">
  <label for="browser">Ro'yxatdan brauzeringizni tanlang:</label>
  <input list="browsers" name="browser" id="browser">
  <datalist id="browsers">
    <option value="Ed ge">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
  </datalist>
  <input type="submit">
</form>

<p><strong>Eslatma:</strong>Datalist yorlig'i Safari 12.0 (yoki oldingi versiyalarida) qo'llab-quvvatlanmaydi.</p>

</body>
</html>