Skip to main content
All docs
V25.1
  • DevExpress v25.1 Update — Your Feedback Matters

    Our What's New in v25.1 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

    Take the survey Not interested

    FullscreenWizardPage Class

    A base class for fullscreen pages of the Report Wizard or Data Source Wizard.

    #Declaration

    TypeScript
    export class FullscreenWizardPage extends WizardPageBase

    #Inherited Members

    #constructor

    Creates a new instance of the FullscreenWizardPage class with the default settings.

    #Declaration

    TypeScript
    constructor()

    #Properties

    #events Property

    Provides access to the page’s event collection.

    #Declaration

    TypeScript
    events: DevExpress.Analytics.Utils.EventManager<FullscreenWizardPage, IWizardFullscreenPageEvents<FullscreenWizardPage>>

    #Property Value

    Type Description
    EventManager<FullscreenWizardPage,IWizardFullscreenPageEvents<FullscreenWizardPage>>

    The event manager.

    #Remarks

    The following table lists page events and describes how you can use them to customize the page.

    Page Event

    Description

    beforeSectionInitialize

    Occurs before the section’s initialize method is called.

    Handle this event to customize the section’s content and state. For instance, you can remove a specific element or customize the section’s options.

    afterSectionInitialize

    Occurs after the page’s initialize method is called.

    Handle this event to customize the section’s settings to display in the UI. For instance, you can check a specific option (a data member, field or data connection).

    Use the ASPxClientReportDesigner.CustomizeWizard event to handle the page’s events as shown below.

    <script type="text/javascript">
        function beforeSectionInit(args) {
            // ...
        }
        function beforePageInit(args) {
            args.page.events.addHandler("beforeSectionInitialize", beforeSectionInit);
        }
    
        function CustomizeWizard(s, e) {
            if(e.Type === "ReportWizard") {
                e.Wizard.events.addHandler("beforePageInitialize", beforePageInit)
            }
        }
    </script>
    
    <dx:ASPxReportDesigner ID="ASPxReportDesigner1" runat="server">
        <ClientSideEvents CustomizeWizard="CustomizeWizard" />
    </dx:ASPxReportDesigner>
    

    See the following topics for more information:

    #Methods

    #canFinish Method

    Specifies whether the Finish button is enabled on a wizard page.

    #Declaration

    TypeScript
    canFinish(): boolean

    #Returns

    Type Description
    boolean

    true, if the Finish button is enabled; otherwise, false.

    #canNext Method

    Specifies whether the Next button is enabled on a wizard page.

    #Declaration

    TypeScript
    canNext(): boolean

    #Returns

    Type Description
    boolean

    true, if the Next button is enabled; otherwise, false.

    #commit Method

    Commits the page settings to the state.

    #Declaration

    TypeScript
    commit(): JQuery.Promise<any, any, any>

    #Returns

    Type Description
    Promise<any,any,any>

    A JQuery Promise object that identifies whether the commit succeeded.

    #dispose Method

    Disposes the page.

    #Declaration

    TypeScript
    dispose(): void

    #getNextSectionId(sectionId) Method

    Returns the next section’s ID.

    #Declaration

    TypeScript
    getNextSectionId(
        sectionId: string
    ): any

    #Parameters

    Name Type Description
    sectionId string

    The current section’s ID.

    #Returns

    Type Description
    any

    The next section’s ID.

    #initialize(state) Method

    Initializes the page.

    #Declaration

    TypeScript
    initialize(
        state: DevExpress.Analytics.Wizard.IDataSourceWizardState,
        stateChanged?: boolean
    ): JQuery.Promise<any, any, any>

    #Parameters

    Name Type Description
    state IDataSourceWizardState

    The page’s state.

    stateChanged boolean

    #Returns

    Type Description
    Promise<any,any,any>

    A JQuery Promise object that identifies whether page initialization succeeded.

    #registerSection(sectionId, metadata) Method

    Registers the specified section.

    #Declaration

    TypeScript
    registerSection(
        sectionId: string,
        metadata: DevExpress.Analytics.Wizard.IWizardPageMetadata<IWizardPage>
    ): void

    #Parameters

    Name Type Description
    sectionId string

    The section ID.

    metadata IWizardPageMetadata<IWizardPage>

    The section metadata.

    #registerSections Method

    Registers the page’s predefined sections.

    #Declaration

    TypeScript
    registerSections(): void

    #setSectionPosition(sectionId) Method

    Sets the section position.

    #Declaration

    TypeScript
    setSectionPosition(
        sectionId: string,
        position?: DevExpress.Analytics.Wizard.Internal.WizardSectionPosition
    ): void

    #Parameters

    Name Type Description
    sectionId string

    The section ID.

    position WizardSectionPosition

    #Remarks

    This method allows you to arrange sections within the page.

    The following example demonstrates how to hide the Select Data Source page’s section that displays available data sources and make the remaining section occupy the entire page.

    <script type="text/javascript">
       function beforePageInit(args) {
           // Identify the "Select Data Source" page.
           if (args.pageId === DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardPageId.SelectDataSourcePage) {
               // Remove the page's section that displays available data sources.
               args.page.unregisterSection(DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseAvailableDataSourcePage);
               // Make the "Select data source type" section occupy the entire page.
               args.page.setSectionPosition(DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseDataSourceTypePage);
               // Override the navigation logic to skip the removed section.
               args.page.getNextSectionId = function(sectionId) {
                   if(!sectionId) return DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseDataSourceTypePage;
               }
           }
       }
    
       function CustomizeWizard(s, e) {
           if(e.Type === "ReportWizard") {
               e.Wizard.events.addHandler("beforePageInitialize", beforePageInit)
           }
       }
    </script>
    
    <dx:ASPxReportDesigner ID="ASPxReportDesigner3" runat="server">
        <ClientSideEvents CustomizeWizard="CustomizeWizard" />
    </dx:ASPxReportDesigner>
    

    See the following topics for more information:

    #unregisterSection(sectionId) Method

    Hide the specified section from the wizard page.

    #Declaration

    TypeScript
    unregisterSection(
        sectionId: string
    ): void

    #Parameters

    Name Type Description
    sectionId string

    The section ID.

    #Remarks

    Pass the corresponding FullscreenReportWizardSectionId/FullscreenDataSourceWizardSectionId value as the method parameter.

    The following example demonstrates how to hide the Select Data Source page’s section that displays available data sources.

    <script type="text/javascript">
       function beforePageInit(args) {
           // Identify the "Select Data Source" page.
           if (args.pageId === DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardPageId.SelectDataSourcePage) {
               // Remove the page's section that displays available data sources.
               args.page.unregisterSection(DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseAvailableDataSourcePage);
               // Make the "Select data source type" section occupy the entire page.
               args.page.setSectionPosition(DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseDataSourceTypePage);
               // Override the navigation logic to skip the removed section.
               args.page.getNextSectionId = function(sectionId) {
                   if(!sectionId) return DevExpress.Reporting.Designer.Wizard.FullscreenReportWizardSectionId.ChooseDataSourceTypePage;
               }
           }
       }
    
       function CustomizeWizard(s, e) {
           if(e.Type === "ReportWizard") {
               e.Wizard.events.addHandler("beforePageInitialize", beforePageInit)
           }
       }
    </script>
    
    <dx:ASPxReportDesigner ID="ASPxReportDesigner3" runat="server">
        <ClientSideEvents CustomizeWizard="CustomizeWizard" />
    </dx:ASPxReportDesigner>
    

    See the following topics for more information: