Select2 DropDownList 功能在选择 gridview 中的项目后消失

Question

我有一个 gridview 和 gridview 内的下拉列表到 select 个项目。因为我的项目列表很大，所以我使用 JQuery Select2 插件进行搜索。所以我在站点母版页中添加了引用和初始化代码，并且首次成功初始化了 select2 功能。然而，在我 select 第一项之后，下拉菜单变为正常下拉菜单并失去所有 select2 功能。

我在我的 asp.net 网络应用程序中使用 AdminLTE 3 模板的 select2 插件，sql 作为数据库。

主页中的引用和初始化代码：

<link rel="stylesheet" href="plugins/select2/select2.min.css"/>
<script src="plugins/select2/select2.full.min.js"></script>
    <script>
  $(function () {
    //Initialize Select2 Elements
    $('.select2').select2()
  })
</script>

下拉列表：

<asp:TemplateField HeaderText="Item Name" ItemStyle-Wrap="false" ControlStyle-Width="250px" HeaderStyle-Wrap="false">
   <ItemTemplate>
      <asp:DropDownList ID="drpItemname" runat="server" Width="200px" CssClass="form-control select2" OnSelectedIndexChanged="GetItemDetails" AutoPostBack="true"></asp:DropDownList>
   </ItemTemplate>
   <HeaderStyle Wrap="False" />
   <ItemStyle Wrap="False" />
</asp:TemplateField>

第一页加载后的屏幕截图：

项目 selected 后的屏幕截图：

Answer 1

您只需添加此代码

<script>
$(function () {
                $(".select2").select2();
            });
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
        prm.add_endRequest(function (sender, e) {
            $(function () {
                $(".select2").select2();
            });
        });
    }
</script>

prm.add_endRequest 在 UpdatePanel 完成加载时触发。

Select2 DropDownList 功能在选择 gridview 中的项目后消失

Select2 DropDownList Functionality Disappearing after selection of an item in gridview

c#

asp.net

postback

gridview

jquery-select2