CODEWITHSUNDEEP
javascriptc#jqueryasp.net
Richard
Richard

Reputation: 137

Select2 is not working in ASP.Net UserControl

I am using the Select2 plugin examples. It is working on all pages however it is not working in a usercontrol. I have a usercontrol as below:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="SearchPage.ascx.cs" Inherits="SIGORTAPRO.WEB.UC.SearchPage" %>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="../../../js/select2.js"></script>
<link href="../../../Content/css/select2.css" rel="stylesheet" />

<asp:Panel ID="panel" runat="server" Visible="false">
    <asp:DropDownList ID="ddlSearchDropdownlist" runat="server"></asp:DropDownList>
</asp:Panel>

(function () {
    $("#<%= ddlSearchDropdownlist.ClientID %>").select2();
})();

Main Page as below

 <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <uc1:SearchPage runat="server" ID="SearchPage" />
            </ContentTemplate>
</asp:UpdatePanel>

If i load page there is no any error however Select2 is not working. The panel is hidden, however I make it visible if I load page. What am I missing?

Upvotes: 1

Views: 1665

Answers (1)

freefaller
freefaller

Reputation: 19953

Visible="false" means the resultant <div> and its contents are not rendered (i.e. the browser literally won't know anything about them because they will not be in the HTML that the browser receives).

If you want it to be hidden but still there for your code to deal with, then use style="display:none;" or appropriate class definition.

For example...

<asp:Panel ID="panel" runat="server" style="display:none;">
    <asp:DropDownList ID="ddlSearchDropdownlist" runat="server"></asp:DropDownList>
</asp:Panel>

Or...

<style type="text/css">
  .myHiddenPanel {
    display: none;
  }
</style>
<asp:Panel ID="panel" runat="server" CssClass="myHiddenPanel">
    <asp:DropDownList ID="ddlSearchDropdownlist" runat="server"></asp:DropDownList>
</asp:Panel>

Upvotes: 2

Related Questions