Organizational Chart Diagram

[Hafiz]

Hi,

I've created org chart diagram using sample in the documentation. 

1) When I double click a node in the org. chart, is it possible to get the id and parentId of the node in the doubleClick event? 

2) In the documentation Constraints in ASP.NET Core Diagram control - Syncfusion , two constraints is use but in my visual studio red underline and unable to compile.

[Sivakumar Sekar]

Hi RWEM ICT, 

Please find the response for queries in the below table 

When I double click a node in the org. chart, is it possible to get the id and parentId of the node in the doubleClick event?

When we double click on the node, the diagram’s double click event gets triggered. In that event, you can able to get in which element we have clicked through source arguments. Please refer to the below code snippet  <ejs-diagram id="diagram" width="100%" height="700px" nodes="@ViewBag.nodes" connectors="@ViewBag.connectors" created="created" doubleClick="doubleClick">                        </ejs-diagram>  function doubleClick(args) {      alert('Hit');    }

In the documentation Constraints in ASP.NET Core Diagram control - Syncfusion , two constraints is use but in my visual studio red underline and unable to compile.

When a diagram gets created, diagram created event gets triggered. In that event, you can set constraints to the diagram. Please refer to the below code snippet for how to set constraints for the diagram  function created() {              var diagramElement = document.getElementById('diagram');              var diagram = diagramElement.ej2_instances[0];              //Enable virtualization in diagram              diagram.constraints = DiagramConstraints.Default | DiagramConstraints.PageEditable,                  diagram.dataBind();          }

Regards 

Sivakumar  

[Hafiz]

Hi Sivakumar,

Thank you for the reply but how do I get id and parent id from the 'args'?
If not possible is there other way?

[Arunkumar Manoharan]

Hi RWEM ICT,  

 

The parent id can be found by using the double click event while double-clicking on the node the outEdges of the node is taken and bypassing the outEdges in getobject() the parent node id is taken. For more information, please refer to the code snippet.

Code Snippet: 

function doubleClick(args) { 

  var outEdge = diagram.getObject(args.source.outEdges[0]); 

  var parentId = diagram.getObject(outEdge.sourceID).id; 

} 

 

Regards,
Arun. 

[Hafiz]

Hi Syncfusion team,

Actually what I want is id and parentId of the data that is bind to the node.

For org. chart diagram we can set datasource using below code:

<e-diagram-datasourcesettings id="Id" parentId="Manager" dataManager="new DataManager() { Data = (List<OrganizationalDetails>)@ViewData["Data"] }"></e-diagram-datasourcesettings>

Therefore, I want to know if I can get the datasource id and parentId of any node in the diagram in double click event.

[Hafiz]

Nevermind, just figured it out myself.

function doubleClick(args) {
var dataId= args.source.data.Id;
var dataParentId = args.source.data.Manager;
}

However for the constraint, when I set
 diagram.constraints = DiagramConstraints.Default | DiagramConstraints.PageEditable, 

I got below error in console

Uncaught ReferenceError: DiagramConstraints is not defined

[Sivakumar Sekar]

Hi RWEM ICT, 

Thanks for your update.  

Regards, 

Sivakumar