How can I prevent dragging of elements selected by a port when validateMagnet is false?

[james-ep01]

Introduction

I know that if validateMagnet is not normal, return false, and then you can't draw links on the port.

However, what I want to implement is to return false, display a message, and prevent dragging using the impossible port of the element. The image becomes strange when the user drags the impossible port.

If the user tries to create a link on a port that cannot be linked, I want to display an error message and prevent dragging of elements on that port.

What should I do in this case?

Steps to reproduce

No response

Restrictions & Constraints

No response

Does your question relate to JointJS or JointJS+. Select both if applicable.

JointJS, JointJS+

[Geliogabalus]

With this demo in mind you can specify validateMagnet callback as follows:

  validateMagnet: function (cellView, magnet, evt) {
    // Note that this is the default behavior. It is shown for reference purposes.
    // Disable linking interaction for magnets marked as passive
    if (magnet.getAttribute("magnet") === "passive") {
      cellView.preventDefaultInteraction(evt);
      alert("message");
      return false;
    }

    return true;
  },

preventDefaultInteraction() shows to the paper that it should not trigger interactivity when this event is fired.

[james-ep01]

Thank you, and that works well.