Question

我正在使用由silviomoreto创建的bootstrap的实时搜索选择插件，我有一个复杂功能！

当前有一个标准的选择框用于添加动态选项值，现在该列表已经变得如此之长，以至于我必须在选择框中实现搜索功能！这就是我以前的做法。

HTML

 <select id="model" name="model" class="soflow-color">
                <option selected="true" disabled="disabled">Select Car Model</option>
            </select>

Jquery的

$('#make').change(function() {

        $year=$("#year option:selected").val();
        $make=$("#make option:selected").text().toLowerCase();

        $make=$make.replace(/\s/g,"-");
        $('#model').html("");
        var obj={
            year:$year,
            make:$make,
        };
        $.ajax({
            type: 'post',
            url: '<?=base_url()?>Home/ajax_search_step2',
            dataType: 'json',
            data:obj,

            beforeSend: function(){

                var target = document.getElementById('make-spinner')
                var spinner = new Spinner(opts).spin(target);
                $(target).data('spinner', spinner);

            },
            complete: function(){
                $('#make-spinner').data('spinner').stop();
            },
            success: function (data) {
                $.each(data, function(key, value){
                    $('#model').append("<option value='"+value.model_name+"'>"+value.model_name+"</option>");
                });
            }
        });

        $('#trim').html("<option selected='true' disabled='disabled'>Select Car Trim</option>");
    });

这对于简单选择的情况工作正常，但我想要的是添加搜索功能，我更喜欢上面的插件。

但是当我试图在其中添加一些选项时，它无效！生成的html与我们通常选择的完全不同！有什么帮助吗？

Answer 1

自己动手了！

更新版本，允许您动态刷新选择列表，而不是更改我需要的内容是添加此

 $(".selectpicker").selectpicker('refresh');

所以基本上它变成了！

 success: function (data) {
                    $('#model').replaceAll('');
                    $.each(data, function(key, value){
                        $('#model').append("<option value='"+value.model_name+"'>"+value.model_name+"</option>");
                    });
 $(".selectpicker").selectpicker('refresh');
                }

将动态选项值添加到实时搜索选择插件

1 个答案: