Recreating Material design dropdown with search

Hey everyone,

I am trying to recreate a component. One which has a dropdown and predictive search.

I want it to support both:

  • User wants to see which options are available, so they click on the dropdown and can see it all.
  • User wants to search for a particular item, they type the first letter and is prompted with options.

I want this component to work interchangeably from the same set of data. Would that be possible?

This is where I am:


Very possible. Clicking on the input and/or the drop arrow could show the entire list. Once someone starts typing, the list filters to show only the valid results.

There’s a predictive search widget in the “Sample UI Patterns” library that comes with Axure 9. There’s also lots of examples on the forums:

Thank will have a look and see if it works

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.