ASPxClientPopupControlBase.AfterResizing Event
Occurs on the client side when window resizing completes.
Declaration
AfterResizing: ASPxClientEvent<ASPxClientPopupWindowEventHandler<ASPxClientPopupControlBase>>
Event Data
| Property |
Description |
| window |
Gets the popup window object related to the event.
|
The ASPxClientPopupControlBase.BeforeResizing and AfterResizing events allow a window’s content to be programmatically hidden/minimized and restored when the window is resized by an end-user.
These events are useful, allowing a window to be resized per end-user requirements. For instance, typically, an end-user can’t resize a window to make it smaller than its content (such as an image). Now, to allow such window resizing, you can programmatically minimize or hide the window’s content, by handling the ASPxClientPopupControlBase.BeforeResizing event, and restore/update the content’s size according to the new size of the window within the AfterResizing event handler.
Example
At present, ASPxPopupControl does not have the built-in capability to resize nested controls when it's resizing. This example illustrates how to automatically resize controls places inside the popup. To accomplish this task, execute the following steps:1. Set the ASPxPopupControl.ScrollBars property to "Auto". This option will allow the popup control to evaluate the content width and height.2. Handle the ASPxClientPopupControl.AfterResizing event. In this event handler, call the AdjustControl method for a desired control to force it to reevaluate its size.3. Place the control into the <div style="height: 100%; width: 100%; overflow: hidden"> element. This element is necessary to overcome scrollbars that can be shown when ScrollBars="Auto" is set.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxPopupControl" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxSplitter" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.ASPxEditors.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<!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>How to resize ASPxSplitter placed inside ASPxPopupControl when resizing ASPxPopupControl
</title>
<script type="text/javascript">
function OnClick(s, e) {
ASPxPopupControl1.Show();
}
function OnAfterResizing() {
splitter.AdjustControl();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxPopupControl ID="ASPxPopupControl1" runat="server" Height="500px" Width="500px"
ScrollBars="Auto" AllowResize="true" LoadContentViaCallback="OnFirstShow">
<ClientSideEvents AfterResizing="OnAfterResizing" />
<ContentCollection>
<dx:PopupControlContentControl ID="PopupControlContentControl2" runat="server" SupportsDisabledAttribute="True">
<div style="height: 100%; width: 100%; overflow: hidden">
<dx:ASPxSplitter ID="ASPxSplitter2" runat="server" Width="100%" Height="100%" ClientInstanceName="splitter">
<Panes>
<dx:SplitterPane>
<ContentCollection>
<dx:SplitterContentControl ID="SplitterContentControl3" runat="server" SupportsDisabledAttribute="True">
</dx:SplitterContentControl>
</ContentCollection>
</dx:SplitterPane>
<dx:SplitterPane>
<ContentCollection>
<dx:SplitterContentControl ID="SplitterContentControl4" runat="server" SupportsDisabledAttribute="True">
</dx:SplitterContentControl>
</ContentCollection>
</dx:SplitterPane>
</Panes>
</dx:ASPxSplitter>
</div>
</dx:PopupControlContentControl>
</ContentCollection>
</dx:ASPxPopupControl>
</div>
<dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False" Text="Show PopUp">
<ClientSideEvents Click="OnClick" />
</dx:ASPxButton>
</form>
</body>
</html>
Imports Microsoft.VisualBasic
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Partial Public Class _Default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
End Sub
End Class
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" %>
<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxPopupControl" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxSplitter" TagPrefix="dx" %>
<%@ Register Assembly="DevExpress.Web.ASPxEditors.v11.1, Version=11.1.8.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
Namespace="DevExpress.Web.ASPxEditors" TagPrefix="dx" %>
<!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>How to resize ASPxSplitter placed inside ASPxPopupControl when resizing ASPxPopupControl
</title>
<script type="text/javascript">
function OnClick(s, e) {
ASPxPopupControl1.Show();
}
function OnAfterResizing() {
splitter.AdjustControl();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<dx:ASPxPopupControl ID="ASPxPopupControl1" runat="server" Height="500px" Width="500px"
ScrollBars="Auto" AllowResize="true" LoadContentViaCallback="OnFirstShow">
<ClientSideEvents AfterResizing="OnAfterResizing" />
<ContentCollection>
<dx:PopupControlContentControl ID="PopupControlContentControl2" runat="server" SupportsDisabledAttribute="True">
<div style="height: 100%; width: 100%; overflow: hidden">
<dx:ASPxSplitter ID="ASPxSplitter2" runat="server" Width="100%" Height="100%" ClientInstanceName="splitter">
<Panes>
<dx:SplitterPane>
<ContentCollection>
<dx:SplitterContentControl ID="SplitterContentControl3" runat="server" SupportsDisabledAttribute="True">
</dx:SplitterContentControl>
</ContentCollection>
</dx:SplitterPane>
<dx:SplitterPane>
<ContentCollection>
<dx:SplitterContentControl ID="SplitterContentControl4" runat="server" SupportsDisabledAttribute="True">
</dx:SplitterContentControl>
</ContentCollection>
</dx:SplitterPane>
</Panes>
</dx:ASPxSplitter>
</div>
</dx:PopupControlContentControl>
</ContentCollection>
</dx:ASPxPopupControl>
</div>
<dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False" Text="Show PopUp">
<ClientSideEvents Click="OnClick" />
</dx:ASPxButton>
</form>
</body>
</html>
See Also