ASPxClientPopupControlBase.AfterResizing Event

Occurs on the client side after the control redrawn a resized window.

Declaration

AfterResizing: ASPxClientEvent<ASPxClientPopupWindowEventHandler<ASPxClientPopupControlBase>>

Event Data

The AfterResizing event's data class is ASPxClientPopupWindowEventArgs. The following properties provide information specific to this event:

Property	Description
window	Gets the popup window object related to the event.

Remarks

When the AllowResize property is set to true, users can resize windows. The ResizingMode property specifies when the control redraws the window during the resizing operation. The available values are listed below:

Live

The control re-calculates window layout and redraws the window dynamically. The nested containers (for instance, a Splitter container) are not adjusted dynamically.
The BeforeResizing and AfterResizing events fire on every size change.

Postponed

The control re-calculates window layout and redraws the window (including all its nested controls) at the end of the resizing operation.
The BeforeResizing and AfterResizing events fire once after the resizing operation is finished.

The BeforeResizing and AfterResizing events allow you to hide or minimize a window’s content and restore it when the window is resized, or to adjust the nested controls.

Example

The ASPxPopupControl does not have the built-in capability to resize nested controls when it is resizing. This example illustrates how to automatically resize controls places inside the popup.

To accomplish this task, execute the following steps:

1. Set the ScrollBars property to Auto. This option allows the popup control to evaluate the content width and height.

2. Handle the AfterResizing event. In the 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.

View Example: How to resize ASPxSplitter placed inside ASPxPopupControl when resizing ASPxPopupControl

JS

function OnClick(s, e) {
    ASPxPopupControl1.Show();
}
function OnAfterResizing() {
    splitter.AdjustControl();
}

Default.aspx

<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" />
                            </ContentCollection>
                        </dx:SplitterPane>
                        <dx:SplitterPane>
                            <ContentCollection>
                                <dx:SplitterContentControl ID="SplitterContentControl4" runat="server" SupportsDisabledAttribute="True" />
                            </ContentCollection>
                        </dx:SplitterPane>
                    </Panes>
                </dx:ASPxSplitter>
            </div>
        </dx:PopupControlContentControl>
    </ContentCollection>
</dx:ASPxPopupControl>
<dx:ASPxButton ID="ASPxButton1" runat="server" AutoPostBack="False" Text="Show PopUp">
    <ClientSideEvents Click="OnClick" />
</dx:ASPxButton>