Disable save button if no node in the graph

GoJS
1

Hello team,

Issue: on the initial load of the screen, there are no nodes/links only the palette items.
When use drags one of the node, in handleModelChange I’m setting a state isDisabled to false. The initial state of isDisabled is true.
Which means “button” is disabled initialy when dragged a node, it is enable.

But what if user deletes that node, how can i make that button disabled again. :(

2

How would they be able to save their now-empty diagram if the button is disabled?

Note how many of the samples have code like this, updating the “Save” button and the page title:

    // when the document is modified, add a "*" to the title and enable the "Save" button
    myDiagram.addDiagramListener("Modified", e => {
      var button = document.getElementById("SaveButton");
      if (button) button.disabled = !myDiagram.isModified;
      var idx = document.title.indexOf("*");
      if (myDiagram.isModified) {
        if (idx < 0) document.title += "*";
      } else {
        if (idx >= 0) document.title = document.title.slice(0, idx);
      }
    });

In it you could check whether myDiagram.nodes.count === 0 or e.diagram.nodes.count === 0 to decide what to do.

3

Let me give more clarificatoins,
I’ve created a button with below code:

Save

and on the initial load the state isDisabled is set as below:
constructor function : this.state { isDisabled : true }
So initially the button is disabled.
Once the user drags any node from palette it should be enabled, so i added this.setState({isDisabled : false}) in the handleModelChange.

Which makes by button enabled, but if the user deletes that dragged node the save should be again disabled. This is were I’m stuck, on handleModelChange the state is getting false only. Is there anything in handleModelChange which can help me to validate that the dragged node is deleted and there are no nodes on the canvas? So that i can make the state as true on that validation?

Can you suggest on this?

4

Can i call any gojs function in initdiagram to keep count of nodes on the canvas?

5

At any time you can get the Diagram.nodes property and get its count, as I showed in my previous reply.

6

Yup, but this is only in initDiagram.

Consider the graph is clean, nodes count is 0.

what if user drags a node which makes the node count 1 in init diagram only.
But how can i save this count instantly in the state of the component to access all over the component.

As if user deletes it, the count should get reduced as well.

7

Why duplicate state and have to keep it updated when you can get the true value at any time?

8

okay Diagram.nodes property and get its count ,

how can i access above anywhere in the component?

9

Get a reference to the Diagram, and then diagram.nodes.count.