选择选择器引导程序

Question

我已经完成了一些代码，使用JQuery将名称绑定到dropdownlist中，并且工作正常，但是高级程序员要求我将其他代码添加到现有代码中。

HTML：

 <div class="col-md-3">
     <select id="sel_group" name="group_id"  class="bs-select form-control input-medium">
        <option value="">Select Group....</option></select>
 </div>

我的代码：

$(document).ready(function () {

var url_list = "api/usergroup/getdata";
$.getJSON(url_list)
.done(function (data) {
    $.each(data, function (index, obj) {
        $("#sel_group").append("<option value='" + obj.id + "'>" + obj.name + "</option>")
        console.log(obj.name);
    })
});

}）;

他的代码：

$(".bs-select").selectPicker({

iconBase: 'fa',
tickIcon: 'fa-check',

}）;

但是当我将代码添加到我的代码中时，它对我不起作用，我不确定他为什么要我添加此代码？

Answer 1

这就是他的意思，可能（我制作了虚拟JSON数组）：JSFiddle

项目中应该具有的依赖关系：

  

https://code.jquery.com/jquery-1.11.3.min.js   https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css   https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js   https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/css/bootstrap-select.min.css   https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.7.5/js/bootstrap-select.min.js   http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css

您需要在select：

中添加类 show-tick

<div class="col-md-3">
    <select id="sel_group" name="group_id"  class="show-tick bs-select form-control input-medium">
        <option value="">Select Group....</option>
    </select>
</div>

另外，我无法访问您的方法，因此我制作了一些虚拟JSON数组。它应该可以工作：

$(".bs-select").selectpicker({
        iconBase: 'fa',
        tickIcon: 'fa-check'
    });

$(document).ready(function () {

    var url_list = "api/usergroup/getdata";

    var obj = [{'id': 25, 'name': 'Amel'}, {'id': 7, 'name':'Legend'}];

    /*$.getJSON(url_list)
    .done(function (data) {*/
    $.each(obj, function (index, value) {
        console.log(value);
        $("#sel_group").append("<option value='" + value.id + "'>" + value.name + "</option>").selectpicker('refresh');
    });
    //});
});

最后，他希望这样的结果如下：