我无法在关闭对话框中关闭对话框

Question

Here is and a screenshot I uploaded for you根据您在评论中的建议，我编辑了我的帖子，发布了我的代码的更新版本。我附上了/ ** /我的原始帖子以帮助您。

/*In jointJS I try using a `ui.dialog` to delete all my graph with the following code: 

    var dialog = new joint.ui.Dialog({ 
       width: 400, 
       title: 'Create new process', 
       content: '<b>Cleanup current drawing?</b>', 
       closeButton: false, 
       buttons: [ 
        { action: 'ok', content: 'OK' }, 
        { action: 'cancel', content: 'CANCEL' } 
       ] 
      }); 

      dialog.on('action:ok', this.graph.clear, this.graph); 
      dialog.on('action:cancel', dialog.close, dialog); 
      dialog.open(); 
     }, 

After pressing OK button I successfully delete my graph but my dialog still remains without being able to delete it. 

Any help please? */ 

这是我更新的代码，不幸的是仍然无法按预期工作。我提醒你，其中显示一个确定此对话框的形式和取消按钮，我想下面的：

1）当按下OK我想： 一）删除我目前的图形和 B）关闭我的对话框

2）当按下取消我想： 闭上对话框（这在我的最初版本与dialog.close successfylly工作）

openNew: function() { 
     // By pressing Create New Process button, a popup form asks for 
     //our confirmation before deleting current graph 
     var dialog = new joint.ui.Dialog({ 
      width: 400, 
      title: 'Create new process', 
      content: '<b>Cleanup current drawing?</b>', 
      closeButton: false, 
      buttons: [ 
       { action: 'ok', content: 'OK' }, 
       { action: 'cancel', content: 'CANCEL' } 
      ] 
     }); 

     //Since in 'action:ok' of dialog.on the 3rd parameter is used in the 
     //callback of multi_hand we must pass dialog and graph both together.To do so 
     //we enclose them in an object named together and we pass it instead 

     together= {dialog : dialog, graph : this.graph}; 

     //Since jointJS supports assigning multiple events for same handler 
     //BUT NOT multiple handlers for the same event we create function multi_hand 
     multi_hand: function (together) 
     { 
      together.graph.clear(); 
      together.dialog.close(); 
     } 
     dialog.on('action:ok', multi_hand, together); 
     dialog.on('action:cancel', dialog.close, dialog); 
     dialog.open(); 
    }, 

通过使用这种新的代码我joinjtJS项目意外崩溃。 我会如何让OK按钮起作用？

Answer 1

我解决我的问题，这样一来，我只是想与大家分享作为参考。

openNew: function() { 
    var dialog = new joint.ui.Dialog({ 
      width: 400, 
      title: 'Create new process', 
      content: '<b>Cleanup current drawing?</b>', 
      closeButton: false, 
      buttons: [ 
       { action: 'ok', content: 'OK' }, 
       { action: 'cancel', content: 'CANCEL' } 
      ] 
     }); 

     dialog.on('action:ok', this.graph.clear, this.graph); 
     dialog.on('action:ok action:cancel', dialog.close, dialog); 
     dialog.open(); 
    }, 

Answer 2

dialog.on中的第三个参数是传递给回调函数（第二个参数）的上下文。它说，在回调函数中绑定到this的是什么。 在你的例子中并不清楚是在哪里定义的，如果它真的是this.graph。但是，你可以简单地做它喜欢在下面的例子中，没有通过上下文：

var graph = new joint.dia.Graph; 
var paper = new joint.dia.Paper({ 
    el: $('#paper'), 
    width: 650, 
    height: 400, 
    model: graph, 
    linkPinning: false 
}); 

var r = new joint.shapes.basic.Rect({ 
    position: { x: 50, y: 50 }, 
    size: { width: 100, height: 40 }, 
}).addTo(graph); 

var dialog = new joint.ui.Dialog({ 
    width: 400, 
    title: 'Confirm', 
    content: '<b>Are you sure?</b>', 
    buttons: [ 
     { action: 'yes', content: 'Yes' }, 
     { action: 'no', content: 'No' } 
    ] 
}); 

dialog.on('action:yes', function() { 
    graph.clear(); 
    dialog.close() 
}); 

dialog.on('action:no', dialog.close, dialog); 
dialog.open(); 

如果定义上this：

dialog.on('action:yes', function() { 
    this.graph.clear(); 
    dialog.close(); 
}, this);