DropDown List in Data Inspector AND diagram name

Q1 - I want to use a select box in data inspector. Is there an example i can refer. Also, the list items which will show up in dropdown will be retrieved from a AJAX call.

Q2 - i want to set a name for my diagram, which user will enter when he lands on the page. This NAME has to be part of the generated JSON. Can i add a custom property in GRAPHLINKSMODEL? OR does GOJS provide a solution to this?

examples please!

  1. We don’t have an example, but you can modify the buildPropertyRow function in dataInspector.js to use a select box for a particular property name.

  2. Yes, you could have an HTML element on your page that the user can modify, and then store it in Model.modelData, which can be saved and loaded with JSON.

Thanks Jhardy. So i did add a new BuildPropertyRow and i am able to add a select box. Thats solved.
But for some reason, in case of “isGroup” elements, i get an exception-

Surprisingly this was working fine with older version of dataInspector.js. Now when i have updated my library (because i wanted Password type), this code fails tbody.appendChild(this.buildPropertyRow(k, data[k]));

Can you help me out here?

Ahh, interesting. That’s a bug, since isGroup should always be readonly.

If you add this line to your DataInspector’s declared properties, does the problem go away?

"isGroup": { readOnly: true, show: Inspector.showIfPresent }

Yes Jhardy, Did this.

Without this line , group elements weren’t even becoming a part of canvas. After adding this line in datainspector properties, i am able to drop them, but it creates a replica of parent element and the error still exists in console. Checkout the screenshot.

Hmm, I’m not sure what would cause that. I tried adding a Data Inspector to the Macros sample, which also expands a group when dropped from a palette, but I don’t have that error. What does your buildPropertyRow function look like?

Hi Riddhu,

Q1 - I want to use a select box in data inspector. Is there an example i can refer. Also, the list items which will show up in dropdown will be retrieved from a AJAX call.

I am also having similar requirement where i need to add a dropdownlist in data inspector and bind the values from ajax call.

Can you please provide me an example of doing this which will be very helpful to me?

Thanks

You’ll need to modify the Inspector.buildPropertyRow method to create a <select> element with <option>s instead of the <input> that it normally creates.

How you get the list of options for a particular property is up to you. Maybe you can look at the propertyName and decide exactly what the choices are.

Can you please give any code sample as you already implemented it which would be helpful for me?

No, we have not implemented that, otherwise we would have just pointed you to the code. I was just telling you the steps you needed to take.

This appears to be a duplicate topic: Custom Select List in Data Inspector

Sorry i did not mention name.

As Riddhu already implemented it, my request is to Riddhu who can give me code example.