UML class (inspector)

How can i update every attribute(visibility,field,type) of an UML class from an inspector ?
thank you

I’m not sure what you mean. I do not think that the DataInspector supports showing and changing objects inside Arrays.

Modifying the model data should update the node automatically.

So,if can’t do it from the inspector can i do it from an HTML boxes?

Yes, you can implement that. I believe, but have not yet tested, that you can use the DataInspector to show and allow users to edit the item objects in Arrays. The limitation is that the DataInspector, by default, inspects the Part.data of the primary selected Part, not of any particular item in any particular array that is a property value of that data object.

So you would need to set inspectSelection: false and explicitly call Inspector.inspectObject of the array item that you want the user to see and edit.

It might be sensible to show an HTML list of items, and selecting one of them would inspect that item in a second Inspector.

OK, I just tried this, and it works.

Starting from the http://gojs.net/latest/samples/umlClass.html sample page, I added these references:

<link href="../extensions/DataInspector.css" rel="stylesheet" type="text/css" />
<script src="../extensions/DataInspector.js"></script>

and this DIV to hold the data inspector:

  <div id="myInspectorDiv" class="inspector-container"></div>

In the init function I initialized the Inspector:

    var inspector = new Inspector('myInspectorDiv', myDiagram,
      {
        inspectSelection: false
      });

In both the property item template and the method item template I added this GraphObject.click event handler:

        { click: function(e, obj) { inspector.inspectObject(obj.data); } },

And to avoid confusion, I disabled in-place editing of the text in both of those templates. That means setting editable: false on each of those TextBlocks or just deleting the property setting it to true (because the default value is false).

I suppose you could add commands to add a property or add a method or to remove a property or to remove a method. Those could be implemented in HTML or as context menu commands. Or both ways.

Thank you for your help it works :)

In the next release the DataInspector has been improved a bit, so that when it is inspecting null (rather than a Node or a Link or some random JavaScript object) it will blank out the inputs rather than continuing to show obsolete data values.

A post was split to a new topic: How to make a Link in a Palette non-draggable

i succed to inspect an object(row) on an UML class using this suggestion:

and this DIV to hold the data inspector:
In the init function I initialized the Inspector:
var inspector = new Inspector('myInspectorDiv', myDiagram,
  {
    inspectSelection: false
  });

In both the property item template and the method item template I added this GraphObject.click event handler:

    { click: function(e, obj) { inspector.inspectObject(obj.data); } },

but i couldn’t inspect a row that doesn’t contain any item,i need to have the possibility to add an attribute informations(visibility,name,type) from the inspector not only from the class cell
i need help,thank you

How could you have a row that did not have a JavaScript object as the data in an Array?

When you set or bind Panel.itemArray to a JavaScript Array, the Panel will automatically copy the Panel.itemTemplate for each item in the Array, and bind the panel to that item. So each “row” will hold and represent a data object that is an array item.

A post was split to a new topic: Clicking on button in palette to start drawing a new link