Datalist Input

#1

Tag:
Link: https://www.codecademy.com/paths/web-development/tracks/learn-html-web-dev-path/modules/learn-html-forms/lessons/html-forms/exercises/datalist-input

In the above exercise, I was told to create a data list like so:

          <datalist id="sauces">
            <option value="ketchup">Ketchup</option>
            <option value="mayo">Mayo</option>
            <option value="bbq">BBQ</option>
          </datalist>

In the picture example that the exercise provides, none of the choices in the data list how up twice. However, the choices in my data list do show up twice when my code is rendered. Why does this happen and how can I fix it?

38%20AM

The browser that I’m using is Google Chrome is that has anything to do with it. Thanks in advance for any help!

#2

looking at the documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist

i see only the value attribute being set. No information between the <option> and </option> tags, and the closing tag doesn’t seem to be necessary either.

setting value attribute and providing text indeed shows duplicate entries in chrome, not in firefox.

using only value attribute, displaying is done correctly in both firefox and chrome

1 Like