Search code examples
javascriptgojs

Go.js Check Box not coming with table

Hello I have developed a code in which MynodeTemplate look like 

GO(go.Node, "Auto",
        GO(go.Shape,
                  new go.Binding("fill", "boxcolor")),
                  GO(go.Panel, "Table",
                    { defaultAlignment: go.Spot.Left, margin: 4 },
                    GO(go.RowColumnDefinition, { column: 1, width: 4 }),
                    GO(go.TextBlock,
                      { row: 0, column: 0, columnSpan: 3, alignment: go.Spot.Center },
                      { font: "bold 12pt sans-serif" },
                      new go.Binding("text", "name")),
                      //Checkbox code 
                      GO(go.TextBlock, "Meta Item : ",
                        { row: 1, column: 0 }),
                    GO(go.TextBlock,
                      { row: 1, column: 2 },
                        new go.Binding("text", "MetaItemName")),
                    GO(go.TextBlock, "Perspective: ",
                                 { row: 2, column: 0 }),
                    GO(go.TextBlock,
                      { row: 2, column: 2 },
                    new go.Binding("text", "PerspectiveName")),

                  ),
                  new go.Binding("scale", "scale").makeTwoWay(),
                  new go.Binding("font", "font").makeTwoWay(),
                  new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
                  new go.Binding("locationSpot", "dir", function(d) { return spotConverter(d, false); })
                );

and UI look like

enter image description here

I want to put one checkbox beside my first name so I have code like 

GO("CheckBox","name",{row:1,column:1}),

but it's not coming

Solution

  • It works fine for me, except that you set the RowColumnDefinition.width of column 1 to be 4, which is really too narrow for a checkbox. Changing that width of 4 to be 14 wide results in: checkbox in Table Panel

    Note that if the user checks the "CheckBox", it modifies the data.name property, because that is the property name that you gave in the definition of the "CheckBox". But you also have the first TextBlock bound to the data.name property, which is why in the second node the title/header text has been changed to "true".

    By the way, I didn't see this question about GoJS until now because you tagged with "go.js" rather than "gojs". I suggest that you remove/delete the "go.js" tag and tag this with "gojs".