Link label not persisting

GoJS
1

Hi,

I am adding a label to a link programmatically, which then displays on the diagram correctly.
When I persist the model, the link label does not appear in the JSON.

Please advise, thanks,

Ian.

        function linkDoubleClick(e, obj) {
            var nodeIndex = obj.data.from;
            currentLink = obj;
            var node = diagram.findNodeForKey(nodeIndex);
            if (node.data.item == "Conditional") {
                jQuery('#conditionalSelectModal').modal('show');
                var index;
                for (index = 0; index < node.data.Conditions.length; index++) {
                    jQuery('#ddlCondSelect').append(jQuery('<option>', {
                        value: node.data.Conditions[index].ConditionName,
                        text: node.data.Conditions[index].ConditionName
                    }));
                }
            }
        }

        jQuery('#conditionalSelectModal').on('hide.bs.modal', function (e) {
            var textblock = new go.TextBlock();
            textblock.text = jQuery('#ddlCondSelect').val();
            textblock.margin = 5;
            currentLink.add(textblock);
        });
2

So every time you show the “#conditionalSelectModel” panel you expect to add a TextBlock to the Link?

If that is what you want, we need a longer discussion.

If instead you just want a single label on the link and you just want to modify the text, then I suggest you add the TextBlock to the Link template and add a TwoWay Binding of that TextBlock.text property to some property on your link data.

GoJS has a model-view architecture (actually M-V-VM). That typically means that the model is much simpler than the Diagram with its Nodes and Links consisting of many GraphObjects each with many properties. So the programmer is required to specify what needs to be saved in the model. For app-specific property values, that’s easy – just establish a TwoWay Binding. Structural changes to the graph are automatically handled by GoJS – creating/deleting node data and link data and changing relationships between them.

3

Also, whenever you make changes, you want to wrap all of the code in a transaction. That’s true whether you want to have multiple text labels or just a single one whose text is modified.

4

Hi Walter,

Thanks for the info. It’s the first option - I want to add a label to a link and persist it.

I have the following link template with two-way binding:

        diagram.linkTemplate = $(go.Link,
                                $(go.Shape),
                                $(go.Shape, { toArrow: "OpenTriangle", fill: null }),
                                $(go.TextBlock, new go.Binding("text", "text").makeTwoWay()),
                                { doubleClick: linkDoubleClick }
                                );

I then set the text block on the link:

        jQuery('#conditionalSelectModal').on('hide.bs.modal', function (e) {
            var textblock = new go.TextBlock();
            textblock.text = jQuery('#ddlCondSelect').val();
            textblock.margin = 5;
            diagram.startTransaction();
            currentLink.add(textblock);
            diagram.commitTransaction();
        });

Still not persisting?

Thanks.

Ian.

5

Sorry Walter. Its the ‘If instead you just want a single label on the link and you just want to modify the text’ option I am after.

6

diagram.linkTemplate = $(go.Link,
$(go.Shape),
$(go.Shape, { toArrow: “OpenTriangle” }),
$(go.TextBlock, { name: “TB” }, new go.Binding(“text”).makeTwoWay()),
{ doubleClick: linkDoubleClick }
);

jQuery(’#conditionalSelectModal’).on(‘hide.bs.modal’, function (e) {
if (currentLink !== null) {
var textblock = currentLink.findObject(“TB”);
currentLink.diagram.startTransaction();
textblock.text = jQuery(’#ddlCondSelect’).val(); currentLink.diagram.commitTransaction();
}
});

7

Thanks Walter, works a treat.