如何删除jsPlumb连接

I am playing with jsplumb, but I am not able to delete the connection between two divs having only the id of one div.

 

---

 

If you've multiple connections from or to elements, detaching all connections is maybe not the best solution to delete a connection. There is a (not well documented) function to detach exactly one connection:

jsPlumb.detach(connection, {
    fireEvent: false, //fire a connection detached event?
    forceDetach: false //override any beforeDetach listeners
})

In my example, I want to delete a connection when the connector is clicked:

 jsPlumb.bind('click', function (connection, e) {
     jsPlumb.detach(connection);
 });

 

2017年10月01日57分04秒

 

I found the solution in the documentation (http://jsplumb.org/doc/usage.html)

jsPlumb.detachAllConnections("elementId");

 

2017年10月01日57分04秒

 

If source div or target div id is already known, then you can delete the connection like this:

var conn = jsPlumb.getConnections({
              //only one of source and target is needed, better if both setted
              source: sourceId,
              target: targetId
            });
if (conn[0]) {
  jsPlumb.detach(conn[0]);
}

You can also use jsPlumb.getAllConnections() to get the array of all connections, and test every connection's sourceId or targetId to get exactly the connection you need;

 

2017年10月01日57分04秒

 

After all the endpoint connections, to and from the element are deleted, you need to detach it as shown in the 3rd line

jsPlumb.detachAllConnections(divID);
jsPlumb.removeAllEndpoints(divID);
jsPlumb.detach(divID); 
divID.remove()

 

2017年10月01日57分04秒

 

Hi you can refer to this: Detach connection jsPlumb

This block of code allows to detach connection if a connection was clicked:

jsPlumb.bind("click", function(conn) {
    jsPlumb.detach(conn);
});

 

2017年10月01日57分04秒

 

This code removes all "wrong" connections in a game I'm developing. I hope it helps

var wrong_connections = new Array(DB_ID, ANOTHER_DB_ID);
var connections = jsPlumb.getConnections();
$.each(connections, function(index, value) { // going through all connections
  var source_id = value.source.attr('id').substring(28);  // I need the ID from DB so I`m getting it from the source element
  for (var a = 0; a < wrong_connections.length; a++) {  
    if (source_id == wrong_connections[a]) {
      jsPlumb.detach(value);
    }
  }
});

 

2017年10月01日57分04秒

 

jsPlumb.deleteConnectionsForElement(elementId)

works. Though it's old I'd like to add that finding out what methods a library has, provided it's self descriptive enough is quite easy.