Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Datalist Element | Forms
Ultimate HTML

Datalist ElementDatalist Element

The <datalist> element in HTML is used to create a pre-defined list of options for an <input> element. It allows the user to select an option from a list of pre-defined options, while also giving them the ability to enter their own value if they choose to. The list of predefined values is hidden up to the moment a user starts to type in the associated text field. We combine <datalist> with id attribute and <input> with list attribute.

html

index.html

css

index.css

js

index.js

Overall, the <datalist> element can be a helpful way to provide a pre-defined list of options for users to select from, while still allowing them the flexibility to enter their own value if needed.

1. Which HTML element is used to create a drop-down list with multiple options?
2. What is the purpose of the `datalist` element?
3. What attribute is used to link a `datalist` element to an `input` element?

Which HTML element is used to create a drop-down list with multiple options?

Виберіть правильну відповідь

What is the purpose of the datalist element?

Виберіть правильну відповідь

What attribute is used to link a datalist element to an input element?

Виберіть правильну відповідь

Все було зрозуміло?

Секція 5. Розділ 9
course content

Зміст курсу

Ultimate HTML

1. Web Development

Web WorldWhat is the Internet?Understanding How the Internet WorksHow a Website WorksFrontend vs Backend DevelopmentPath to Success

2. Tags and Attributes

Unveiling the Potential of HTML Tags and AttributesTagsAttributesPaired and Single TagsText MarkupChallenge 1: Text MarkupChallenge 2: Text MarkupChallenge 3: Text MarkupSpecial Purpose Text MarkupChallenge: Special Purpose Text MarkupValidation

3. Document Structure

Secrets of Structural Web PagesStructureDocument HeadDocument FlowChallenge: Document StructureDeveloper Tools

4. Media and Tables

Magic of Rich Media and Dynamic TablesImagesChallenge: ImagesSpecial Purpose ImagesGraphic FormatsAudio and Video EmbeddingChallenge: Audio and VideoTablesChallenge: Tables

5. Forms

Power of Forms: Interact and EngageForm Creation Basis Label for Input ElementInput AttributesInput TypesChallenge: Input and LabelTextarea ElementSelect ElementDatalist ElementGrouping Form Elements

Ultimate HTML

Datalist ElementDatalist Element

The <datalist> element in HTML is used to create a pre-defined list of options for an <input> element. It allows the user to select an option from a list of pre-defined options, while also giving them the ability to enter their own value if they choose to. The list of predefined values is hidden up to the moment a user starts to type in the associated text field. We combine <datalist> with id attribute and <input> with list attribute.

html

index.html

css

index.css

js

index.js

Overall, the <datalist> element can be a helpful way to provide a pre-defined list of options for users to select from, while still allowing them the flexibility to enter their own value if needed.

1. Which HTML element is used to create a drop-down list with multiple options?
2. What is the purpose of the `datalist` element?
3. What attribute is used to link a `datalist` element to an `input` element?

Which HTML element is used to create a drop-down list with multiple options?

Виберіть правильну відповідь

What is the purpose of the datalist element?

Виберіть правильну відповідь

What attribute is used to link a datalist element to an input element?

Виберіть правильну відповідь

Все було зрозуміло?

Секція 5. Розділ 9
some-alt