Enable/Disable a button programatically

How to enable/disable a button programatically?

Requirement:

1. Initially, button should be disabled.
2. Enable/Disable it separately.

I have defined by button like this:

myBottomBar =
	$(go.Diagram, "myBottomBarDiv",
	{
		isReadOnly: true,
		"animationManager.isEnabled": false,
		contentAlignment: go.Spot.TopRight,
		allowHorizontalScroll: false,
		allowVerticalScroll: false,
		allowZoom: false,
		padding: 0
	});

myBottomBar.add(
	$(go.Part, go.Panel.Horizontal,
				
			$("Button",
					{
				margin: 5,
				click: function() {
					if (dataModified == true) {
						dataModified = false;
					}
					
					resetDiagram = true;
					
					mainDiv.style.display = mainDivDisplay;																						
					treeGridParentDiv.removeChild(goFirst);
					ganttDiagramParentDiv.removeChild(goSecond);											  
					mainDiagramDiv.removeChild(treeGridParentDiv);
					mainDiagramDiv.removeChild(ganttDiagramParentDiv);											  
					mainDiv.removeChild(mainDiagramThird);
					mainDiv.removeChild(mainDiagramForth);
					mainDiv.removeChild(mainDiagramDiv.domNode);											
					meUpdateUI.startup();										
				} 
					},
					$(go.TextBlock, "Reset", { margin: 2 })
			)
		)
	)

Are you asking about setting Panel | GoJS API ?

I’m curious why you are using GoJS buttons when I would guess you could have used HTML buttons.

Can’t use HTML buttons. Need to use GoJS buttons only.

Can this (Panel | GoJS API) be used for Enabling/Disabling the buttons. If Yes, how? Is there any sample available for the same?

Yes. I don’t know if there is a public sample demonstrating it. Try it.

Sorry, am appearing very silly, but could you please help me by providing syntactically correct code lines for this.

Thanks.

  $("Button", { isEnabled: false },
      . . .)

Yeah, this way i initialized and make it disabled.

But, now i want to make it enable some where else based on some conditions. How this can be done?

Either set it programmatically or use a binding.

what would be the syntax to set it, programatically?

That question and the reason most people use data bindings are discussed at GoJS Using Models -- Northwoods Software.

Also: GoJS Data Binding -- Northwoods Software

Not able to find the button details and set its property. Trying to use something like this:

var resetButton = myBottomBar.findObject("ResetButton");
resetButton.isEnabled = true;

But, its not working.

You should have gotten an error there because there is no Diagram.findObject method.

You need to find the Part that you want and then call findObject on that. There are various methods on Diagram that find Parts. Or you can just keep a reference to the one that you added.

Looking for the correct syntax for my scenario, but not able to get it.

var buttonPart = $(go.Part, . . ., 
                   $("Button",
                     { name: "ResetButton", isEnabled: false, . . . },
                     . . . ),
                 . . . );
myDiagram.add(buttonPart);

Then later:

    if (...) buttonPart.findObject("ResetButton").isEnabled = true;

Thanks! Got it.