chartstransitionmxgraphjgraph

How to get source and target of edge after any change on cell connect?


I'm programming a web application that use workflow. I used jgraph(Mxgraph) for designing workflow.

I will save workflow parts in database (activities, notifications, transitions). I need to get source and target of transitions. So how should I catch any changes on transitions in client?

I used before from these three events but don't work always. For example when I change connection target.

Editor.graph.connectionHandler.addListener(mxEvent.CONNECT, function (sender, evt) {
            console.log('connect');
});
Editor.graph.connectionHandler.addListener(mxEvent.START, function (sender, evt) {
            console.log('start');
});
Editor.graph.connectionHandler.addListener(mxEvent.RESET, function (sender, evt) {
            console.log('reset');
});

Solution

  • I found it. We can use mxEvent.Change event for getting any change on graph model.

            editor.graph.getModel().addListener(mxEvent.CHANGE, function (sender, evt) {
                editor.graph.validateGraph();
                var xml = getEditorXml(Editor);
                $("#BpmnXml").val(xml);
    
                //console.log(getCells_ByType("Start"));
                // /console.log(getCells_ByType("Task"));
                let connectors = getCells_ByType("Connector");
                if (connectors != null && connectors.length > 0) {
                    connectors.forEach(element => {
                        var source = Editor.graph.getModel().getTerminal(element, true);
                        var target = Editor.graph.getModel().getTerminal(element, false);
                        setData(element, { FromActivityClientId: source.getId(), ToActivityClientId: target.getId() });
                    });
                }
            });
    
    function getCells_ByType(TypeCell) { // dar report estafede mishavad
        var AllCells = Editor.graph.getChildCells(Editor.graph.getDefaultParent(), true, true);
        var result = $.grep(AllCells, function (s) { return s.getValue().localName == TypeCell; });
        if (result.length != 0)
            return result;
        else
            return null;
    }