Live Search Select Picker

by André Albson

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.js"></script>
<select class="selectpicker" id="funcao" multiple>
      <option value="lider">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="lider">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="lider">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="lider">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>

JavaScript

$('select').change(function(){
  var sel = $(this);        
  disableThis(sel);       
  $('.selectpicker').selectpicker('refresh');
});

function disableThis(sel){
  var val = sel.val();
  var temSelecionado = false;
  $("option[value='lider']").each(function(){
    if(this.selected){
      temSelecionado = true;      
      $(this).parent().each(function(){
        $(this.options).each(function(){        
          if($(this).val() != "lider")
          {
            $(this).prop("selected", false);
                $(this).prop("disabled",true);
          }
        }
        )        
      })
     }
  });
   $(sel).children().each(function(){
     var thisLider = false;
     if($(this).val() == "lider" && $(this).prop("selected"))
       thisLider = true;
  	if($(this).val() != "lider" && thisLider)
      $(this).prop("disabled",true);
  });
  
  $("select").children().each(function(){
    if($(this).val() == "lider" && temSelecionado){
      $(this).prop("disabled",true);      
    } 
  })
}