Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

555
Vistas
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 la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda