JSFiddle - React, Tailwind, and code Playground

by Guruprasad Rao

HTML

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="http://silviomoreto.github.io/bootstrap-select/bootstrap-select.min.js"></script>
<link rel="stylesheet" href="http://silviomoreto.github.io/bootstrap-select/bootstrap-select.min.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<a href="#">
    <select class="selectpicker" data-live-search="true">
          <option>Mustard</option>
          <option>Ketchup</option>
          <option>Relish</option>
          <option>Plain</option>
          <option>Steamed</option>
          <option>Toasted</option>
      </select>
</a>

CSS

body{margin:50px auto;text-align:center;}

JavaScript

$('.selectpicker').selectpicker();

$('button.dropdown-toggle').on('click',function(e){
    if($(e.target).attr('class')!="caret")
    {
        e.stopPropagation();
    }
});