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="1">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="1">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="1">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>
    <br><br>
    <select class="selectpicker" multiple>
      <option value="1">Líder</option>
      <option value="conhecimento">Para Conhecimentor</option>
      <option value="participante">Participante</option>
    </select>

JavaScript

var unique = 1;

$('select').on('change', function(){
    var options = $('.selectpicker').find('option').filter(function(){
        return unique == this.value;
    });
    //para nao ocultar do select pai
    if(unique == this.value){
        options.hide();
        $(this).find('option[value="'+unique+'"]').show();
        $(this).each(function() {
                $(this.options).each(function() {
                	if(($(this).val() == "1")){
                  	$('select').on('change', function(){
        							var $this = $(this),
            					$value = $this.val();
        							if ($this.val() == null) {
                      	alert('uhuul');
                          options.show();
                          $(this).prop("disabled", false);
                          $('.selectpicker').selectpicker('refresh');
                      }
    });
                  }
                    if ($(this).val() != "1") {
                        $(this).prop("disabled", true);
                    }
                })
            });
        $('.selectpicker').selectpicker('refresh');
    }
    else {
        if($(this).find('option[value="'+unique+'"]:visible').size() > 0){
            options.show();
           
        }
    }
});