jsPlumb源連接器不移動時源容器被拖動

Question

<div id="a"></div> 
<div id="b"></div> 
<div id="c"></div> 

    var conn = ""; 
    var instance = ""; 

    $(function(){ 
     create_line("b"); 

     $('#b').click(function(){ 
      create_line("b"); 
     }); 

     $('#c').click(function(){ 
      create_line("c"); 
     }); 
    }); 

    function create_line(el){ 
     jsPlumb.ready(function() { 

      if(conn!=""){ 
       jsPlumb.detach(conn); 
      } 

      instance = jsPlumb.getInstance({ 
       Anchors : [ "Center", "Center" ], 
       DragOptions : { cursor: 'pointer', zIndex:2000 }, 
       EndpointStyles : [{ fillStyle:"red", outlineColor:"white", outlineWidth:10 }, { fillStyle:"red", outlineColor:"white", outlineWidth:10 }], 
       Endpoints : [ ["Dot", { radius:5 } ], [ "Dot", { radius:5 } ] ], 
       PaintStyle : { 
        strokeStyle:"red", 
        lineWidth:3 
       } 
      }); 

      var a = jsPlumb.getSelector("#a"); 

      instance.draggable(a); 

      conn = instance.connect({ 
       source:a, 
       target:el, 
       connector:[ "Straight" ] 
      }); 

     }); 
    } 

http://jsfiddle.net/wwc7G/5/

當窗口加載#A和#B之間移動線連接器，但是當我點擊#C#A和之間的線路連接器#c不會移動。

請幫助和抱歉我的英語。

Answer 1

刪除parent從makeSource調用爲我工作。

http://jsfiddle.net/wwc7G/27/

jsPlumb.ready(function() { 

    jsPlumb.Defaults.Container=$("#container"); 
    jsPlumb.Defaults.PaintStyle = { strokeStyle:"#F09E30", lineWidth:2, dashstyle: '3 3', }; 
    jsPlumb.Defaults.EndpointStyle = { radius:7, fillStyle:"#F09E30" }; 
    jsPlumb.importDefaults({Connector : [ "Bezier", { curviness:50 } ]}); 

    var i = 1; 

    $('#addproject').click(function(e) { 
    var newAgent = $('<div>').attr('id', 'project' + i).addClass('project'); 
    newAgent.text('Project ' + i); 

    $('#container').append(newAgent); 

    jsPlumb.draggable(newAgent, { 
     containment: 'parent' 
    }); 

    i++; 
    }); 

    $("#container").on('click','.project',function(e) { 
    var newState = $('<div>').attr('id', 'state' + i).addClass('task'); 

    var title = $('<div>').addClass('title').text('Task ' + i); 
    var connect = $('<div>').addClass('connect').text('click here to drag a bond'); 

    newState.css({ 
     'top': e.pageY, 
     'left': e.pageX 
    }); 

    newState.append(title); 
    newState.append(connect); 

    $(this).append(newState); 

    jsPlumb.makeTarget(newState, { 
     anchor: 'Continuous' 
    }); 

    jsPlumb.makeSource(connect, { 
     anchor: 'Continuous' 
    }); 

    newState.dblclick(function(e) { 
     jsPlumb.detachAllConnections($(this)); 
     $(this).remove(); 
     e.stopPropagation(); 
    }); 

    i++;  
    }); 
});