Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

562
Visualizações
Bootstrap select picker - How to put a search text in the selectpicker searchbox and trigger the dropdown to display search result, using javascript?

I am building a Razor Pages ASP.NET CORE 3.0 web application.

I am using a Bootstrap "selectpicker" dropdown having "data-live-search= true". I am populating the dropdown with names of employees. Following is the dropdown code.

<select id="spdd" name="spdd" asp-for="employee"
asp-items="@Model.employees"
value="Search" style=""
class="selectpicker show-tick form-control" data-live-search="true">
</select>

I am using "1.12.4" version of Bootstrap "selectpicker" -

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/css/bootstrap-select.css" rel="stylesheet" /> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.4/js/bootstrap-select.js"></script>

I am trying to search and display in the selectpicker dropdown the employee names that matches the search text entered in a textbox. On search button click, I want the selectpicker dropdown to display the result. Following is the html code of search text box and search button.

<div class="col-xs-11 col-sm-11 col-md-6 col-lg-9"
style="padding-right:0px">
  <input type="text" asp-for="@Model.EmployeeSearchText"
  class="form-control" id="EmployeeSearchText"
  name="EmployeeSearchText" placeholder="Enter Employee Search Text"
  value="">
<div class="col-xs-1 col-sm-1 col-md-6 col-lg-9 text-left" style="padding-left:0px">
  <button class="btn btn-secondary" type="button" id="btnEmployeeSrch">
   <i class="fa fa-search"></i>
  </button>
</div>

Following is the jquery script that tries to put the employee search text in the selectpicker searchbox and triggers change in selectpicker dropdown to display employees as per the search text .

 $("#btnEmployeeSrch").click(function () {
                var EmployeeSearchText = $("#EmployeeSearchText");
                $('#spdd').parent().find('.bs-searchbox input').attr('value', EmployeeSearchText);
                $('#spdd').selectpicker('search.update')
                $("#spdd").trigger('propertychange');
                $('#spdd').selectpicker('refresh');
            })

The above jquery code is not working.

Question:

  1. How can I put a search text in the selectpicker searchbox and trigger the dropdown to display search result, using javascript?
about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda