Im trying to create a search bar that is able to search multiple keys and values. An example of the use will be "type: car, model: toyota". The available keys will have autocomplete. My initial idea was once the user starts typing to show the available keys, once he selects one add the selected key to the input with a ':' like:

enter image description here

everything you write after the ':' will be the value. Once you hit enter I was thinking about cheating a chip with the key and value entered and repeat the process. You will have at the end of your key/value selection a list of chips created based on your entries that are going to be used for the actual search.

My concerns are: - Is this a clean way of doing this? - Do you know any sites that have a similar search behavior I can take inspiration from? - How should I handle a long list of parameters (note that the searchbar has limited width and height in the page)? - Any other suggestions on how to approach this?


1 Answer 1


The cloud console in Google Cloud has a rule builder (not search) that uses a label:value filter to create a rule.

enter image description here

They have (in this case), a limited amount of labels.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.