Selectedindexchanged not firing after dropdownlist shown in jquery popup

0
votes

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.

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.

Here are the important sections of the code:

The sample page loading the control:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="homebed.aspx.cs" Inherits="txwebsite._testbed.homebed" %>
<%@ Register TagPrefix="tx" TagName="querycriteria" Src="../_userctrls/querycriteria.ascx" %>

Scriptmanager inside that sample page:

<asp:ScriptManager ID="ScriptManager1" EnablePartialRendering="true" EnableViewState="true" runat="server"></asp:ScriptManager>

First lines of my user control:

<%@ Control Language="C#" EnableViewState="true" AutoEventWireup="true" CodeBehind="querycriteria.ascx.cs"
    Inherits="TelefileWebsite._userctrls.querycriteria" %>
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" ChildrenAsTriggers="true" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddProvince_kharid" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>

Definition of the div which wraps dropdownlist:

<div id="divContentToPopup" style="display:none;">

the dropdownlist which is not firing selectedindexchanged and makes the problem:

<asp:DropDownList ID="ddProvince_kharid" AutoPostBack="true" 
                        CssClass="ddforpopup" style="margin-right:7px;" runat="server" 
                        onselectedindexchanged="ddProvince_kharid_SelectedIndexChanged">
                    </asp:DropDownList>

selectedindexchanged definition:

protected void ddProvince_kharid_SelectedIndexChanged(object sender, EventArgs e) {

the whole jquery 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

I checked the whole stackoverflow and many other websites but none of them were suggesting a solution:

1
jqueryasp.netpopupupdatepanelselectedindexchanged

1 Answers