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 我想: a)删除我当前的图表并且 b)关闭我的对话框
2) 当按下取消时我想:
关闭我的对话框(在我的初始版本中使用 dialog.close
成功运行)
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 按钮起作用?
最佳答案
dialog.on
中的第三个参数是传递给回调函数的上下文(第二个参数)。它说,在回调函数中绑定(bind)到 this
的是什么。
在您的示例中,不清楚 graph
的定义位置,如果它确实是 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();
如果 graph
是在 this
上定义的:
dialog.on('action:yes', function() {
this.graph.clear();
dialog.close();
}, this);
关于javascript - 我无法关闭 jointJS 中的对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38784079/