We have been looking at a lot of dropdowns and I always like taking a step back and giving a summary
because it can seem quite daunting.
And I don't want you to stand too close to the wall that you can't see the painting, or you can't see
the wood through the trees, as they say.
So anyway, this is just a very quick summary on dropdown menus.
And remember by dropdown menus I just mean a way for a user to select many different options.
And HTML gives us two ways to allow users to select a dropdown, either through the select box or the
autocomplete box.
We then looked at select first, didn't we? And that gives the user a predefined set of options to choose
from.
And then moving away from the select box, we had this autocomplete box. And in order to create this
autocomplete box, we use the datalist element and it provides a quick native means of displaying input
suggestions to a user.
And this datalist element is cool because it allows autocompletion, right?
It uses our list that we predefined, but it also lets the user enter their own custom values, which
is extremely useful.
The other thing with datalists is that they are mostly used with text input types, but they don't
have to be.
For example, they can be used where the input type is set to range, for example.
It can also be used on other elements.
I've mentioned this previously, like the select element.
And another cool thing with the datalist is that it's native to the browser, and this means that
it has a smart filter, autocomplete logic and filtering that makes it easier for us to deliver a better
solution faster with less testing required.
But as I mentioned, there's not always the good right?
There are limitations with datalist and one of them is a lack of customization.
If you need a more robust solution, you're going to have to look at third party libraries.
For example, jQuery's UI autocomplete widget might be a good place for you to start.
But anyway, this was just a very quick summary on what we've learned.
Hope you're having a ton of fun and I'll see you in the next lecture.