Skip to main content
Tab

ASPxPopupControl.ClientSideEvents Property

Gets an object that lists the client-side events specific to the current popup control.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v24.2.dll

Declaration

public PopupControlClientSideEvents ClientSideEvents { get; }

Property Value

Type Description
PopupControlClientSideEvents

An object that allows you to handle the popup control’s client-side events.

Remarks

The ClientSideEvents property provides access to an object of the PopupControlClientSideEvents type. This object contains properties whose names correspond to the events available to a popup control on the client side. These properties provide the ability to assign JavaScript handlers to the required client-side events of the popup control.

Example

This example demonstrates how nested popup windows can be displayed using the ASPxPopupControl.

function KeyHandler(e) {
        if (e.keyCode == 27)
            if (window2.IsVisible())
                window2.Hide();
            else if (window1.IsVisible())
                window1.Hide();
            else
                return false;
        return true;
}
<head id="Head1" runat="server">
    <title>Nested modal windows</title> 
</head>
<body id="body" onkeydown="return KeyHandler(event);">
    <form id="form1" runat="server">
        <dx:ASPxPopupControl ID="window1" runat="server" Modal="true" HeaderText="First Window" 
PopupElementID="body" ClientInstanceName="window1" CloseAction="CloseButton" PopupAction="None" 
PopupHorizontalAlign="WindowCenter" PopupVerticalAlign="WindowCenter" AllowDragging="True">
            <ContentCollection>
                <dx:PopupControlContentControl runat="server">
                    <dx:ASPxButtonEdit ID="ASPxButtonEdit1" runat="server" 
                        Text="Click Ellipsis Button to open Second Modal Window">
                        <Buttons>
                            <dx:EditButton></dx:EditButton>
                        </Buttons>
                        <ClientSideEvents ButtonClick="function(s, e) {
                            window2.Show();
                        }" />
                </dx:ASPxButtonEdit>
                </dx:PopupControlContentControl>
            </ContentCollection>
        </dx:ASPxPopupControl><dx:ASPxPopupControl ID="window2" runat="server" Modal="true" 
            HeaderText="Second Window" PopupElementID="ASPxButtonEdit1" 
            ClientInstanceName="window2" 
            CloseAction="CloseButton" PopupAction="None" PopupHorizontalAlign="WindowCenter" 
            PopupVerticalAlign="WindowCenter" AllowDragging="True">
            <ContentCollection>
                <dx:PopupControlContentControl>
                    <dx:ASPxDateEdit ID="ASPxDateEdit1" runat="server">
                    </dx:ASPxDateEdit>
                    <dx:ASPxButton ID="ASPxButton2" runat="server" AutoPostBack="False" 
                    Text="Close" >
                        <ClientSideEvents Click="function(s, e) {
                            window2.Hide();
                        }" />
                    </dx:ASPxButton>
                </dx:PopupControlContentControl>
            </ContentCollection>
        </dx:ASPxPopupControl>
        <br/>
        <dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False" 
            Text="Open First Window">
            <ClientSideEvents Click="function(s, e) {
                        window1.Show();
            }" />
        </dx:ASPxButton>
    </form>
</body>
See Also