How to add click event handler

I cannot find documentation that addresses adding a handler for the click event on a node.  Can you please provide an example?


4 Replies

SG Shyam G Syncfusion Team August 25, 2014 05:26 AM UTC

Hi Jeff

Thanks for using Syncfusion Products.

We are glad to inform you that we have created a simple sample in which we have fired click event for a node. Please see the code snippet below

model.Click = "onclick";

 

function onclick(args) {

      if(args.element.shape) 

          alert("nodeeventfired");

    }

Please let me know if any concerns.

Regards,

Shyam G



SG Shyam G Syncfusion Team August 25, 2014 05:28 AM UTC

Hi Jeff

Please ignore our previous update.

We are glad to inform you that we have created a simple sample in which we have fired click event for a node. Please see the code snippet below

model.Click = "onclick";

 

function onclick(args) {

      if(args.element.shape) 

          alert("nodeeventfired");

    }

Please let me know if any concerns.

Regards,

Shyam G


Attachment: MvcApplication1_(3)_1ea62cc.zip


JE Jeff August 25, 2014 03:18 PM UTC

Thanks for the example.

 

I assume the purpose for the following test is to determine whether the element is a node:

 

if(args.element.shape)

 

Since connectors do not have a shape property, based on the current API this test would accurately distinguish between the two types that raise the click event -- nodes and connectors.

 

However, this approach is error-prone, because you as a vendor could do one of the following that would break my code:

  • Add a connector.shape property
  • Deprecate and remove the node.shape property
  • Add another type of element that also has a shape property.  The sourceDecorator and targetDecorator are good examples.

 

I very much prefer the approach in MVC Classic, where there were separate NodeClick and ConnectorClick events.

 

If that is not possible, I suggest you add a property to args, indicating the element type.  As a customer, I want a guarantee that your event is handing me the type I expect.



SG Shyam G Syncfusion Team August 26, 2014 04:55 AM UTC

Hi Jeff

Thanks for the update.

We are glad to inform you that we have created a sample in which click event is fired for both nodes and connectors. Please see the code snippet below

$("#diagram").ejDiagram({

            click: onNodeClick,

        });

 

function onNodeClick(args) {

            if (args.element.shape) {

                alert("node event fired");

            }

            if (args.element.line) {

                alert("connectoreventfired");

            }

        }

Please let me know if any concerns.

Regards,

Shyam G


Attachment: WebApplication9johnrobert_(2)_84200852.zip

Loader.
Up arrow icon