All docs
V20.2
21.1 (EAP/Beta)
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.

ASPxClientDiagramCustomShapeCreateTemplateEventArgs.container Property

Returns the template's container.

Declaration

container: any

Property Value

Type Description
any

A container for the template.

Remarks

Add the template content, which must be presented as SVG elements, to the container property.

<script>
function onCustomShapeCreateTemplate(s, e) {
    var department = getDepartment(e.item.key);
    var svgNS = "http://www.w3.org/2000/svg"
    var svgEl = document.createElementNS(svgNS, "svg");
    svgEl.setAttribute("class", "template");
    e.container.appendChild(svgEl);
    var textEl = document.createElementNS(svgNS, "text");
    textEl.setAttribute("class", "template-name");
    textEl.setAttribute("x", "50%");
    textEl.setAttribute("y", "35%");
    textEl.textContent = department.DepartmentName;
    svgEl.appendChild(textEl);
    var btnEl = document.createElementNS(svgNS, "text");
    btnEl.setAttribute("class", "template-button");
    btnEl.setAttribute("x", "50%");
    btnEl.setAttribute("y", "75%");
    btnEl.textContent = "Show Details";
    btnEl.onclick = function() { showInfo(department); };
    svgEl.appendChild(btnEl);
}
</script>

<dx:ASPxDiagram ID="Diagram" ClientInstanceName="diagram" runat="server" Width="100%" Height="600px" 
    NodeDataSourceID="DepartmentDemoDataSource" OnNodeDataBound="Diagram_NodeDataBound">
    <Mappings>
        <Node Key="ID" Text="" ParentKey="ParentID" />
    </Mappings>
    <ClientSideEvents CustomShapeCreateTemplate="onCustomShapeCreateTemplate" />
</dx:ASPxDiagram>

Run Demo: Templates

See Also