myDiagram.addDiagramListener("Modified", function (e) {
var button = document.getElementById("ContentPlaceHolder1_btnSave");
if (button) button.disabled = !myDiagram.isModified;
});
While loading, the listener definition executes with no problem so the function is defined properly and the button is initially disabled.
Then when the user makes changes to the nodes, the code updates the node data and the myDiagram.isModified becomes true. So far all is good. However, the function above does not fire as if the listener itself doesn’t fire. The button never becomes enabled.
Any help would be appreciated. Thank you in advance. Felipe
Your listener code looks just like the ones in the samples, and the samples work the way that you want, don’t they? So I wonder what else is different that would matter. Are there any interesting warning or error messages in the console log? Is your app otherwise working well?
The app works fine with the exception of this problem. I don’t get any errors. The button is a regular asp:button that works ok otherwise. This is its definition:
The entire function below runs ok, setting node properties with no problems. As soon as the first node property gets set, the value of myDiagram.isModified becomes true. Notice that I added the line: myDiagram.isModified = true; at the end of the function just to hover above “isModified” and confirm that is true. However, the listener never fires. I have a stop in it to verify that it does not execute.
function showHideItem(prop) {
var m = myDiagram.model;
var n = 0; // number of shown text elements in each node. The image must resize based on that number so it fits in the node as large as possible.
var imageShown;
if (m) {
m.nodeDataArray.forEach(function (nd) {
imageShown = nd.pictureVisible;
n = 0;
switch (prop.get_text()) {
case "Show Image":
var vis = nd.pictureVisible;
m.setDataProperty(nd, "pictureVisible", !vis);
imageShown = nd.pictureVisible;
break;
case "Show Title Group Name":
var vis = nd.TGNVisible;
m.setDataProperty(nd, "TGNVisible", !vis);
if (nd.TGNVisible) n++; else n--;
break;
case "Show Pocket Name":
var vis = nd.PCNVisible;
m.setDataProperty(nd, "PCNVisible", !vis);
if (nd.PCNVisible) n++; else n--;
break;
case "Show Rank":
var vis = nd.RankVisible;
m.setDataProperty(nd, "RankVisible", !vis);
if (nd.RankVisible) n++; else n--;
break;
}
// resize the image
if (imageShown) {
// resize the image
var tempSizeX = nd.pictureSize.split(" ")[0];
var tempSizeY = nd.pictureSize.split(" ")[1];
var finalSize;
var factor = 1;
factor = factor - Math.abs(n) * 0.15;
if (n > 0) tempSizeX = tempSizeX * factor; else tempSizeX = tempSizeX / factor;
if (n > 0) tempSizeY = tempSizeY * factor; else tempSizeY = tempSizeY / factor;
finalSize = tempSizeX + " " + tempSizeY;
m.setDataProperty(nd, "pictureSize", finalSize);
}
});
myDiagram.isModified = true;
}
}
Are you making these changes within a transaction? Transactions are required. And you don’t need to set Diagram.isModified = true, since that will happen automatically.