populate select picker on live-search event

user_1785499 0
Viewed 4781

I am using a selectpicker (https://silviomoreto.github.io/bootstrap-select/examples/#live-search) that I populate from a rest API.

At this point, I have only 30 entries. however, this number will grow very soon. I want to start with an empty selectpicker, then, when the user write some text in the live-search input, I populate the selectpicker only with the corresponding items.

for example, if the user writes "al", then I will populate my selectpicker with entries containing "al". unfortunately, this class does not contain events on live search. Could you suggest another class??

Any input will help

Regards

bootstrap-selectpicker jquery
3 Answers

Since boostrap-select (or selectpicker) does not support this yet, I've found a workaround.

This is not the best practice, but it works.

 $('#youselectpicker').on('loaded.bs.select', function (e, clickedIndex, isSelected, previousValue) {
        $(".youselectpicker .bs-searchbox input").on('keyup',function(){
            //place your code here
            //don't forget to refresh the select picker if you change the options
        })
      });
user_79060060

My Simple jQuery implementation that works.

    jQuery("select[name='select picker name']").siblings().find("input[type='text']").keyup(function (e) {
        if(e.keyCode==13){
           //Code to implement ajax search
        }
    });
user_101087190
Related