我正在嘗試bootstrap-select使用以下 AJAX 呼叫填充控制元件:
function loadCategories() {
$.ajax({
url: '../handlers/getcategorylist.ashx',
data: null,
method: 'post',
dataType: 'json',
success: function (data) {
alert(JSON.stringify(data));
$('#ddlCategories').html(JSON.stringify(data));
$('#ddlCategories').selectpicker('refresh');
},
error: function (e) {
console.log(e.responseText);
}
});
}
的 HTMLbootstrap-select如下:
<div class="row mb-2">
<div class="col-lg-10 offset-lg-1">
<select id="ddlCategories" name="ddlCategories" data-width="25%" class="form-control selectpicker">
<option value="select">Select From The List</option>
</select>
</div>
</div>
AJAX 呼叫執行并成功。使用JSON.stringify()我得到以下資料(顯示在警報中):

無論出于何種原因,bootstrap-select都不會填充。它顯示為空。我在這里想念什么?
uj5u.com熱心網友回復:
您好,您似乎正在將選擇元素的內部 HTML 設定為物件陣列。您可能必須.forEach()遍歷回應陣列中的所有物件并將它們附加到選擇元素(如以下StackOverflow 答案中所述。如果您還想從選擇元素中洗掉現有內容,請考慮設定html 為空白。
所以類似于:
data.forEach(entry => {
$('#ddlCategories').append(`<option value=${entry['ID']}> ${entry['Name']} </option>`);
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/503870.html
標籤:javascript 阿贾克斯 引导选择 引导选择器
上一篇:來自點擊事件問題的Ajax呼叫
