All docs
V21.1
21.2 (EAP/Beta)
21.1
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2. This link will take you to the root page.
19.1
The page you are viewing does not exist in version 19.1. This link will take you to the root page.
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.

DxReportDesignerCallbacks.CustomizeElements Property

Specifies the JavaScript function that handles the Web Report Designer’s CustomizeElements client-side event.

Namespace: DevExpress.Blazor.Reporting

Assembly: DevExpress.Blazor.Reporting.v21.1.JSBasedControls.dll

Declaration

[Parameter]
public string CustomizeElements { get; set; }

Property Value

Type Description
String

The name of a JavaScript function used to handle the CustomizeElements event.

Remarks

The CustomizeElements event enables you to customize the Web Report Designer’s UI elements.

The handler function receives two parameters - the first parameter is the client-side Document Viewer (the event sender) that exposes the dx property to access the client-side DevExpress objects. The second parameter is an object with the following properties and methods:

  • Elements
    A collection of the Web Report Designer’s UI elements.

  • GetById
    A method that allows you to obtain the element by its ID specified with the DevExpress.Reporting.Designer.Utils.ReportDesignerElements enumeration. Use the s.dx notation to access the enumeration. The enumeration contains the following values:

    • MenuButton - the menu button in the Designer’s upper-left corner.
    • NavigationPanel - the panel at the bottom that shows opened reports.
    • RightPanel - the panel on the right with the Field List, Report Explorer and Properties tabs.
    • Surface - the design surface.
    • Toolbar - the Report Designer Toolbar.
    • Toolbox - the Toolbox with report controls.

The following code hides the Main Menu button:

window.ReportingDesignerCustomization = {
    onCustomizeElements: function (s, e) {
        //Remove Menu button
        var menuButton = e.GetById(s.dx.Reporting.Designer.Utils.ReportDesignerElements.MenuButton); 
        var menuButtonIndex = e.Elements.indexOf(menuButton);
        menuButtonIndex !== -1 && e.Elements.splice(menuButtonIndex, 1)
    }
}
See Also