title: Selectedindexchanged not firing after dropdownlist shown in jquery popup
body: <p>I'm making a user control and the whole of it is inside an updatepanel.
  I've put a dropdownlist (and some other things) inside a div, made the div's display as none, and made itshown after a button click and inside a jquery popup.</p>
  
  <p>The problem is that when it is not inside that jquery popup (and being visible from the begining of page load), it works seamlessly. But after opening it inside a jquery popup, it refuses to react to selectedindexchanged. </p>
  
  <p>Here are the important sections of the code:</p>
  
  <p>The sample page loading the control:</p>
  
  <pre><code>&lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="homebed.aspx.cs" Inherits="txwebsite._testbed.homebed" %&gt;
  &lt;%@ Register TagPrefix="tx" TagName="querycriteria" Src="../_userctrls/querycriteria.ascx" %&gt;
  </code></pre>
  
  <p>Scriptmanager inside that sample page:</p>
  
  <pre><code>&lt;asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" EnableViewState="true" runat="server"&gt;&lt;/asp:ScriptManager&gt;
  </code></pre>
  
  <p>First lines of my user control:</p>
  
  <pre><code>&lt;%@ Control Language="C#" EnableViewState="true" AutoEventWireup="true" CodeBehind="querycriteria.ascx.cs"
      Inherits="TelefileWebsite._userctrls.querycriteria" %&gt;
  &lt;asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="true" runat="server"&gt;
  &lt;Triggers&gt;
  &lt;asp:AsyncPostBackTrigger ControlID="ddProvince_kharid" EventName="SelectedIndexChanged" /&gt;
  &lt;/Triggers&gt;
  &lt;ContentTemplate&gt;
  </code></pre>
  
  <p>Definition of the div which wraps dropdownlist:</p>
  
  <pre><code>&lt;div id="divContentToPopup" style="display:none;"&gt;
  </code></pre>
  
  <p>the dropdownlist which is not firing selectedindexchanged and makes the problem:</p>
  
  <pre><code>&lt;asp:DropDownList ID="ddProvince_kharid" AutoPostBack="true" 
                          CssClass="ddforpopup" style="margin-right:7px;" runat="server" 
                          onselectedindexchanged="ddProvince_kharid_SelectedIndexChanged"&gt;
                      &lt;/asp:DropDownList&gt;            
  </code></pre>
  
  <p>selectedindexchanged definition:</p>
  
  <p>protected void ddProvince_kharid_SelectedIndexChanged(object sender, EventArgs e)
      {</p>
  
  <p>the whole jquery code:</p>
  
  <pre><code>$(function () {
  
      // ---------------------------------------
      // Popup opening
      // ---------------------------------------
      var fn_kharid_LoadGeoWindow = function (e) {
          $(this).speedoPopup(
      {
          width: 598,
          useFrame: false,
          effectIn: "zoomIn",
          effectOut: "slideZoom",
          css3Effects: "zoomOut",
          href: "#divContentToPopup"
      });
      }
  
      var btnchooseregion_kharid = $('#btnChooseRegion_kharid');
      btnchooseregion_kharid.click(fn_kharid_LoadGeoWindow);
  
  });  // Document Ready
  </code></pre>
  
  <p>I checked the whole stackoverflow and many other websites but none of them were suggesting a solution:</p>