We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Custom node client side

Hi!

I have a Diagram and i try create Custom Nodes with extra information. In side server i create my custom node:

public class GaugeNode : Node
    {
        private string email;
        private string phone;
        [JsonProperty("email")]
        [DefaultValue("")]
        public string Email
        {
            get { return email; }
            set { email = value; }
        }
        [JsonProperty("phone")]
        [DefaultValue("")]
        public string Phone
        {
            get { return phone; }
            set { phone = value; }
        }

    


       
    }


And add to my diagram:
 GaugeNode newIdea = CreateNode("NewIdea", 400, 400, 400, 300, "New Idea Identified");
            newIdea.Shape = new Shape(Shapes.Html); //DEPRECARED;
            newIdea.Shape.TemplateId = "Circulargauge";
            newIdea.Email = "pepe";
            
           // newIdea.Type = Shapes.Html;

            //GaugeNode gaugeNode = new GaugeNode();
            //gaugeNode.Email = "papepepep";
            
            model.Nodes.Add(newIdea);             

ok, it's work. But when i try inspect new properties i can't find:



i can't find Email or Phone variable...

any idea? 



7 Replies

SG Shyam G Syncfusion Team March 14, 2016 08:41 AM UTC

Hi David,

You have created a custom property by inheriting the node class, but we have some limitations as shown below.

Limitations:


1. The custom property gets serialized only if the default value and property value are different.

2. Also we have used this serializer to format the object to JSON data internally and send it from the server side to the client side. So if you need any additional features in this method it will not be implemented.


r
Instead of creating the custom property by inheriting the node class, please create an custom property for the node using node’s addInfo property. Please refer to the code example and sample below.

Code example:

  BasicShape node = new BasicShape();

   node.Name = name;

  Dictionary<string, object> addInfo = new Dictionary<string, object>();

  //add an custom property for the node

  addInfo.Add("email", "[email protected]");

  addInfo.Add("phone", "99898989");
  node.AddInfo = addInfo;

//define click event
  model.Click = "click";

<script type="text/javascript">

    function click(args) {

        var node = args.element;

        if (args && args.element.type == "basic") {

            //get an custom property in the client side

            alert("email" + ":" + args.element.addInfo.email + "\n" + "phone" + ":" + args.element.addInfo.phone);

        }     

    }
</script>

Sample:http://www.syncfusion.com/downloads/support/forum/123378/ze/addInfoMVCsample-518592233

Regards,
Shyam G



DA David March 14, 2016 09:01 AM UTC

Hi!

thanks for your response.

Please, can explain it:

The custom property gets serialized only if the default value and property value are different.

I try and don't work:
 private string gisEntitySubType;

        [JsonProperty("ngisEntitySubType")]
        [DefaultValue("")]
        public string GisEntitySubType
        {
            get { return gisEntitySubType; }
            set { gisEntitySubType = value; }
        }
        public GaugeNode()
        {
            this.GisEntitySubType = "juanito";
        }


SG Shyam G Syncfusion Team March 15, 2016 05:40 AM UTC

Hi David,

Please use JsonProperty from Syncfusion namespace using Syncfusion.JavaScript.Shared.Serializer; instead of Newtonsoft namespace using Newtonsoft.Json; to resolve your reported issue. Please refer to the code example below and sample below.

Code example:

Namespace:
using Syncfusion.JavaScript.Shared.Serializer;

Sample:http://www.syncfusion.com/downloads/support/forum/123378/ze/custompropertysample-899531376

Regards,
Shyam G


DA David March 15, 2016 08:54 AM UTC

oh...my fault...

thanks!


SG Shyam G Syncfusion Team March 16, 2016 03:57 AM UTC

Hi David,

Please let me know if you need further assistance on this.

Regards,
Shyam G


DA David March 16, 2016 08:45 AM UTC

It's OK.

Last question... What is better? use addInfo or use custom node


SG Shyam G Syncfusion Team March 17, 2016 09:28 AM UTC

Hi David,


It is better to use addInfo instead of custom Node (custom property by inheriting the node class) because it has some limitations as mentioned earlier. 


Regards,

Shyam G 


Loader.
Up arrow icon