search

cfpb / capital-framework

The Consumer Financial Protection Bureau's user interface framework
https://cfpb.github.io/capital-framework/
Creative Commons Zero v1.0 Universal
54 stars 29 forks source link

[cf-forms] Use datalist element with select element fallback #225

Open KimberlyMunoz opened 9 years ago

KimberlyMunoz commented 9 years ago

From @cfarm in https://github.com/cfpb/cf-forms/issues/34

We can implement this technique to make more useful, usable inputs for things like States.

The datalist element is an HTML5 form element that auto-suggests results from the list based on the user's typed input. So if you start typing "P" in a State datalist you'll get Pennsylvania and other suggestions in the field.

For browsers that don't support this element, we can include a <select> element inside it as a fallback, which is the same as it works now. More on this technique: https://adactio.com/journal/4272

anselmbradford commented 7 years ago

Support isn't great http://caniuse.com/datalist/embed/