ASPxClientControl.AdjustControl Method

Modifies the control’s size against the control’s container.

Declaration

AdjustControl(): void

Remarks

The AdjustControl method recalculates the size of the control’s client object to correctly display it, when the control’s parent container becomes visible dynamically, on the client side.

This method can be used when the visibility and layout of the control’s container, which was initially hidden, is dynamically changed on the client side (for instance, a container DIV element’s DISPLAY attribute changes from NONE to an empty string), and it’s required to recalculate the control’s size.

Note

The AdjustControl method is in effect only for some visible controls whose content size needs to be recalculated depending upon their container’s size (for instance, the ASPxPageControl or the ASPxGridView).

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>