Update group when groups member parts update


We currently have a group template that runs a function when a part is added or removed from it, the function generates some label data from the children which is then added to the groups data to be rendered in the diagram. The jist of this function is it iterates over its member parts gets the names of all the parts from the part data and then builds a name string with this data which is then displayed as part of the group template in a textbox.

This works fine when adding and removing nodes from the group, however if any of the parts are updated (e.g. their name gets changed) the group label does not update. Is there a way of having this function run when any of the groups members update so that the group label reflects its members?


You might want to implement a Model Changed listener that looks for any property changes to nodes that belong to groups, and then update the group.

Typically this means calling Diagram.addModelChangedListener.

As a follow up to this, when listening to model change events will an item emit a change event when its updated using the model.mergeNodeDataArray() function regardless if any properties in that model were changed?

We are getting a few more events from using Diagram.addModelChangedListener() than we were expecting and are trying to find out why…

Yes, you’ll get all of the model’s ChangedEvents. I have no idea of which node data properties your member nodes depend on for their names, but it’s probably just one property. Maybe it’s even called “name”? Whatever it is, you could check for something like:

$(go.Diagram, . . .,
  { . . .,
    "ModelChanged": function(e) {
      if (e.change === go.ChangedEvent.Property && e.propertyName === "name") {
        var data = e.object;
        console.log(data.group); // key of the group that contains the node