Creating a select box with a search option

SBB picture SBB · Sep 14, 2013 · Viewed 237.9k times · Source

I am trying to replicate what you can see here in this image. enter image description here

I want to be able to either type in the text field above the box or just click on the option directly.

What would be the best way to go about that? Is there anything bootstrap related that exists already?

Answer

Hemanth Palle picture Hemanth Palle · Oct 2, 2018

This simple code worked for me

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<input list="brow">
<datalist id="brow">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>  
</body>
</html>

Incase you need to use only select tag use Selectize Js. It has all options we require .Please Try It Demo using Selectize Js