Select picker bootstrap

Question

我已經完成了一些代碼來將名字綁定到dropdownlist和JQuery，它工作正常，但一位高級程序員要求我將其他代碼添加到我現有的代碼中。

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

您需要添加類展示蜱中選擇：

<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'); 
    }); 
    //}); 
}); 

最後，他希望這種蜱是這樣的：