I've looked at lists from both sides now
From give and take and still somehow
It's HTML lists' illusions I recall
I really don't know HTML lists at all
This was a fun little read. Just through testing the examples, I also learned datalist does not seem to work well on mobile safari (which is a large enough market I might even say there’s essentially no scenario in which it’s worth using if there’s a compatibility issue).
>What if there’s a bunch of options, but for [reasons] we don’t want a user to be able to select a subset of them? Let’s add the disabled attribute to an optgroup
Seems broken in mobile safari, not actually disabled I can still select the disabled items.
Came here to mention the same thing. Very well be on me, tho. I’m using the Brave browser (is it safari-powered?) and on iOS 18.7.9, which is the newest my old iPhone X supports.
And yet, no native select + search combined, which is a very common kind of list. The datalist is basically unusable, because you don't know any of the options.
HTML linters actually help distinguish things like that? I'm curious if there are any linters out there that can enforce this kind of semantic tag selection.
Good stuff, except don't get too excited about `datalist`. It just doesn't have enough hooks to be actually useful for anything other than a little prototype.
Title reminds me of Joni Mitchell.
This was a fun little read. Just through testing the examples, I also learned datalist does not seem to work well on mobile safari (which is a large enough market I might even say there’s essentially no scenario in which it’s worth using if there’s a compatibility issue).
Way back when I was working my first job, datalist didn’t work on Firefox. That’s what got Firefox removed from the list of supported browsers.
It has been a problem for a long time if you want to support anything other than Chrome.
>What if there’s a bunch of options, but for [reasons] we don’t want a user to be able to select a subset of them? Let’s add the disabled attribute to an optgroup
Seems broken in mobile safari, not actually disabled I can still select the disabled items.
Not broken, but strange since it should be working on latest Safari.
https://caniuse.com/mdn-html_elements_optgroup_disabled
I think it may be a Safari bug.
Your link states it's not supported in iOS Safari at all, even though it has been supported in macOS Safari since 2013.
Came here to mention the same thing. Very well be on me, tho. I’m using the Brave browser (is it safari-powered?) and on iOS 18.7.9, which is the newest my old iPhone X supports.
And yet, no native select + search combined, which is a very common kind of list. The datalist is basically unusable, because you don't know any of the options.
HTML linters actually help distinguish things like that? I'm curious if there are any linters out there that can enforce this kind of semantic tag selection.
Good stuff, except don't get too excited about `datalist`. It just doesn't have enough hooks to be actually useful for anything other than a little prototype.
I think I’ve tried building a combobox using datalist once but it didn’t work
Lots of useful information I wasn't aware of after being a front-end lead for years. I'll start using these at work for sure.
This is how real HTML magic should look like:
<MARQUEE>
</MARQUEE><MARK>FTFY</MARK>
What I always wanted to know about lists and never dared to ask!
That’s a really good article. It’s nice to see something which isn’t slop.