从AJAX成功追加记录时,Bootstrap选择DropDown无法正常工作

时间:2017-05-14 10:55:02

标签: jquery ajax twitter-bootstrap bootstrap-select

我使用Bootstrap Select插件进行下拉多选和其他操作 当我从数据库中获取记录并附加它以填充下拉列表中的数据(我想要的)以及下拉列表中的数据

enter image description here

HTML:

<div class="col-md-2">
   <asp:Label runat="server"> Select Report's </asp:Label>
</div>

<div class="col-md-4">
   <select class="selectpicker ddlMulti" style="background-color:white"  multiple>
   </select>
</div>

脚本:

$(document).ready(function () {
    $.ajax({
        type: "POST",
        url: "OssmWebService.asmx/FillDropdown",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            $('.ddlMulti').append("<option value='0'>--Select--</option>");
            $.each(data.d, function (key, value) {
                $(".ddlMulti").append($("<option></option>").html(value.IntName));
            });
            debugger;
            $('.ddlMulti').selectpicker('refresh');
        }   
    })
})

1 个答案:

答案 0 :(得分:0)

success: function (data) {
      /*get response as json */
       $('#ddlMulti').find("option:eq(0)").html("Select ..");
      var obj=data;//alert(obj);
      $(obj).each(function()
      {
       var option = $('<option />');
       option.attr('value', this.value).text(this.label);           
       $('#ddlMulti').append(option);
     });  }

使用Id比类更好