Remove panel elements

GoJS
1

I’m trying to remove all elements inside a panel using the following code

                    var nodeLinks = nodeData.findObject('nodeLinks');

                    var elemToRemove = [];
                    _.each(nodeLinks.elements, function (elem) {
                            elemToRemove.push(elem);
                    });

                    _.each(elemToRemove, function (element) {
                        nodeLinks.remove(elemToRemove);
                    });

I got the following error:
Error: Panel.remove:element value is not an instance of GraphObject

if i change the remove line for diagram.remove(elemToRemove) i got this error:
Error: Diagram.remove:part value is not an instance of Part

Im doing something wrong. This is the panel just in case:

                    $(go.Panel, "Vertical",
                        { /*background: "#ffff41",*/ name: "nodeLinks", position: new go.Point(110, 0), visible: false },
                        $("Button",
                            { margin:4 },  // defined below, to support editing the text of the node
                            $(go.TextBlock, "t",
                                { font: "bold 10pt sans-serif", desiredSize: new go.Size(15, 15), textAlign: "center" })
                        ),
                        $("Button",
                            { margin:4 },  // defined below, to support editing the text of the node
                            $(go.TextBlock, "t",
                                { font: "bold 10pt sans-serif", desiredSize: new go.Size(15, 15), textAlign: "center" })
                        ),
                        $("Button",
                            { margin:4 },  // defined below, to support editing the text of the node
                            $(go.TextBlock, "t",
                                { font: "bold 10pt sans-serif", desiredSize: new go.Size(15, 15), textAlign: "center" })
                        )
                    )
2

So you want to remove all of the "Button"s from that “nodeLinks” Panel?

    var panel = part.findObject("nodeLinks");
    while (panel.elements.count > 0) panel.removeAt(0);

Presumably all within a transaction, of course.

One can only add or remove Parts to or from a Diagram. One can only add or remove GraphObjects that are not Parts to or from a Panel.

It’s unusual to remove elements from a Panel, or to add them dynamically, for that matter. What are you trying to accomplish?

3

I want to achieve something like this:

Where the buttons are going to add a new node with link on click, the difference from that demo is that on my diagram this buttons are going to vary between each node, some nodes are going to have 1, 2 or more buttons and i want to add it dynamically because this comes from database.

Now that i add buttons like this:

nodeLinks.add( $("Button", { margin:4 }, // defined below, to support editing the text of the node $(go.TextBlock, "t", { font: "bold 10pt sans-serif", desiredSize: new go.Size(15, 15), textAlign: "center" }) ) );

if i add the buttons to a node i want the possibility to remove also.

4

If the total set of possible buttons is fixed and known now (and not too large) you could bind each of their visible properties to your data.

More generally you could bind Panel.itemArray to an Array in your node data, and set Panel.itemTemplate to a button whose properties are data bound to the properties of the button-describing objects in that [item]Array. GoJS Item Arrays-- Northwoods Software

No need to call Panel.add or Panel.remove. If you dynamically want to add or remove buttons, just call Model.insertArrayItem or Model.removeArrayItem.

5

This sounds way better, thx for the info.