All docs
V24.2
24.2
24.1
23.2
23.1
22.2
22.1
21.2
21.1
20.2
20.1
19.2
The page you are viewing does not exist in version 19.2.
19.1
The page you are viewing does not exist in version 19.1.
18.2
The page you are viewing does not exist in version 18.2.
18.1
The page you are viewing does not exist in version 18.1.
17.2
The page you are viewing does not exist in version 17.2.

JavaScript/jQuery Diagram - propertiesPanel.tabs.groups

Contains an array of command groups in the tab.

Type:

Array<Object>

commands

Lists commands in a group.

Type:

Array<CustomCommand | Command>

A properties panel group can contain default and custom commands. Handle the CustomCommand event to respond to a custom command click.

jQuery
JavaScript
$(function() {
    var diagram = $("#diagram").dxDiagram({
    propertiesPanel: {
        visibility: 'visible',
        tabs: [
            {
                groups: [ { 
                    title: "Page Properties", 
                    commands: ["pageSize", "pageOrientation", {name: "sayHello", text: "Say Hello", icon: "blockquote"}] 
                } ]
            }
        ]
    },
        onCustomCommand: function(e) {
            if (e.name == "sayHello")
            alert("Hello!")
        },
    }).dxDiagram("instance");
});

title

Specifies a title of the group.

Type:

String