Question

我使用的是Select2 jquery控件，它在.aspx页面上工作正常，但是当我在Ajax模态扩展器弹出窗口上使用它时，它不会显示在用户控件.ascx上。出于某种原因，我目前无法使用jquery模式而不是Ajax模式，但需要使用它。这是我的代码

Login.aspx页面

<head runat="server">
<script src="Scripts/jquery-1.9.1.js" type="text/javascript"></script>
<script src="Scripts/select2.min.js" type="text/javascript"></script>
<link href="Styles/select2.css" rel="stylesheet" />
<script type="text/javascript">
    $(document).ready(function () {
        $("#PopupLoginControl1_selectGroup").select2(
 { tags: ["user", "admin", "super admin"]  });
    </script>
 </head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="Scriptmanager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:LinkButton ID="lnkSelectGroup" runat="server" 
           OnClick="ShowMessage">Show    Groups</asp:LinkButton>
        <uc1:PopupLoginControl ID="PopupLoginControl1" OnLoginStatus="PopupLoginCntl_Completed"
            Visible="false" runat="server" />

模态弹出窗口PopupLoginControl.ascx

<%@ Control Language="C#" AutoEventWireup="true" 
CodeFile="PopupLoginControl.ascx.cs"  Inherits="Ajax_PopupLoginControl" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" 
TagPrefix="ajaxtoolkit" %>

<asp:Button ID="btnShowPopup" runat="server" Style="display: none" />

<ajaxtoolkit:ModalPopupExtender BackgroundCssClass="modalBackground" 
CancelControlID="btnClose" runat="server" PopupControlID="Panel1" ID="ModalPopupExtender1"
TargetControlID="btnShowPopup" />

<asp:Panel ID="Panel1" runat="server" DefaultButton="btnOk" Height="300px"
 Width="400px"   BackColor="White">

<table width="100%" border="0" cellpadding="2" cellspacing="5">
<tr><td align="right" valign="middle"><strong>Groups :</strong></td>
<td>
<input type="hidden" id="selectGroup" style="width:300px;" runat="server" />
</td> 
</table>

Answer 1

问题在于，当文档完全呈现时，PopupLoginControl1控制所有内容都不会呈现，因为您将Visible属性设置为false。将下面的代码放在PopupLoginControl.ascx文件的末尾：

(function(){
    $("#<%= selectGroup.ClientID %>").select2({ tags: ["user", "admin", "super admin"]});
})();

Answer 2

只需添加此

<style>

.select2-drop-active {
    position:absolute;
    z-index:10000000;
}

</style>

在你的控制结束时

Select2 jquery控件无法在Ajax模式扩展器弹出窗口中工作

2 个答案: