我無法在關閉對話框中關閉對話框

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);