ASPxPopupControl.ClientSideEvents Property
Gets an object that lists the client-side events specific to the current popup control.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v20.2.dll
NuGet Package: DevExpress.Web
Declaration
Property Value
| Type | Description |
|---|---|
| PopupControlClientSideEvents | A PopupControlClientSideEvents object which allows assigning handlers to the client-side events available to the popup control. |
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>