Javascript Called On PopupControlExtender Hiding

Last post 06-05-2008 7:01 AM by Zhi-Qiang Ni - MSFT. 1 replies.

Sort Posts:

  • Javascript Called On PopupControlExtender Hiding

    05-30-2008, 7:05 PM

    Hi,

    You know how the autocompleteextender has a property called 'OnClientHiding', that you can assign a Javascript function to which will be called when the CompletionList(which is a popupextender) is hiding.

    I need to be able to do something similar with the PopupControlExtender.  I need to be able to call a Javascript function when the popup is closing.  Does anyone know how to do this?

    Thanks,
    Brent

  • Re: Javascript Called On PopupControlExtender Hiding

    06-05-2008, 7:01 AM
    Answer

    Hi Brent,

    From your description, you would like to call a Javascript function when the popup is closing.

    To achieve your goal, please refer to my sample code here: 

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestHidePopUp.aspx.cs"
        Inherits="SoluTest_ModalOutsideUDP.TestHidePopUp" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Untitled Page</title>
        <style type="text/css">
            /*Popup Control*/.popupControl
            {
                background-color: White;
                position: absolute;
                visibility: hidden;
            }
            .closeLabel
            {
                background-color: #666666;
                color: #FFFFFF;
                text-align: center;
                font-weight: bold;
                text-decoration: none;
                border: outset thin #FFFFFF;
                padding: 5px;
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div>
            <asp:Label ID="Lable1" runat="server">This is test Label.</asp:Label><br />
            <asp:TextBox ID="TextBox1" runat="server" ></asp:TextBox>
            <cc1:PopupControlExtender ID="PopupControlExtender2" runat="server" DynamicServicePath=""
                PopupControlID="Panel2" Enabled="True" ExtenderControlID="" TargetControlID="TextBox1"
                Position="Bottom" >
            </cc1:PopupControlExtender>
            <asp:Panel ID="Panel2" runat="server" CssClass="popupControl">
                <div style="border: 1px outset white; width: 100px">
                        This is the Popup panel.
                </div>
            </asp:Panel>
        </div>
        </form>
    
        <script type="text/javascript" language="javascript">
        function pageLoad(){
            var pce = $find("PopupControlExtender2");
            pce.add_hidden(afterHidden);  
        }
        function afterHidden(){
            $get("Lable1").innerText="Hidden";
        }
        </script>
    
    </body>
    </html>
    The add_Hidden method is that: 
        add_hidden : function(handler) {
            /// <summary>
            /// Add an event handler for the hidden event
            /// </summary>
            /// <param name="handler" type="Function" mayBeNull="false">
            /// Event handler
            /// </param>
            /// <returns />
            this.get_events().addHandler('hidden', handler);
        },
    Please feel free to tell me whether this helps or not, thanks!

    Best regards,

    Zhi-Qiang Ni

    Microsoft Online Community Support

    Please remember to click “Mark as Answer” on the post that helps you, and to click “Unmark as
    Answer” if a marked post does not actually answer your question.
Page 1 of 1 (2 items)