wicket 9 中的 ModalDialog 无法正常工作
ModalDialog in wicket 9 doesnt work properly
我在 wicket 9 中使用模态对话框,因为旧模态 Window class 已被弃用,我遇到了一些问题。在 wicket 9 文档中没有 ModalDialog 的示例。不知道是我用错了还是有bug
public class MainPanel extends Panel {
private final ModalDialog modalDialog;
public MainPanel(String id, IModel<String> headingIdx, IModel<String> collapseIdx) {
super(id);
setOutputMarkupId(true);
modalDialog = new ModalDialog("modalWindow");
add(new AjaxLink<Void>("showModalDialog") {
@Override
public void onClick(AjaxRequestTarget target) {
modalDialog.setContent(new ModalPanel("content", MainPanel.this){
@Override
protected void close(AjaxRequestTarget target) {
modalDialog.close(target);
}
});
modalDialog.open(target);
}
});
add(modalDialog);
}
}
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.apache.org">
<head>
</head>
<body>
<wicket:panel>
<div class="col-md-1 text-right">
<a wicket:id="showDeleteDialog" class="btn fa fa-trash p24-2x deleteTrashIcon"></a>
</div>
<div wicket:id="modalWindow" class="modalDialog"></div>
</wicket:panel>
</body>
</html>
public abstract class ModalPanel extends Panel {
public ModalPanel(String id, Panel caller) {
super(id);
setOutputMarkupId(true);
add(new AjaxLink<Void>("cancelBtn") {
@Override
public void onClick(AjaxRequestTarget target) {
close(target);
}
});
}
protected abstract void close(AjaxRequestTarget target);
}
问题是模态对话框打开后,它的行为不像模态对话框。
有人用过 ModalDialog 吗,如果它对你有用,你可以分享你的经验吗?
我觉得你的代码没问题!
您可以将其与示例进行比较:
如果将 ModalDialog
与 Bootstrap 结合使用,您可能会在 Wicket ModalDialog
[=24] 使用的 modal-dialog
class 之间发生冲突=]模板和同名的Bootstrapclass。特别是,Bootstrap modal-dialog
class 关闭指针事件导致在模式对话框中单击无效。
要解决此问题,您可以将 Bootstrap modal-content
添加到 Wicket ModalDialog
内容元素:
add(new AjaxLink<Void>("showModalDialog") {
@Override
public void onClick(AjaxRequestTarget target) {
Panel content = new MyContentPanel("content");
content.add(AttributeModifier.append("class", "modal-content"));
modalDialog.open(content, target);
}
});
或者,您可以将 modal-content
class 添加到用于模式对话框内容的面板的 HTML 模板的根节点。
我在 wicket 9 中使用模态对话框,因为旧模态 Window class 已被弃用,我遇到了一些问题。在 wicket 9 文档中没有 ModalDialog 的示例。不知道是我用错了还是有bug
public class MainPanel extends Panel {
private final ModalDialog modalDialog;
public MainPanel(String id, IModel<String> headingIdx, IModel<String> collapseIdx) {
super(id);
setOutputMarkupId(true);
modalDialog = new ModalDialog("modalWindow");
add(new AjaxLink<Void>("showModalDialog") {
@Override
public void onClick(AjaxRequestTarget target) {
modalDialog.setContent(new ModalPanel("content", MainPanel.this){
@Override
protected void close(AjaxRequestTarget target) {
modalDialog.close(target);
}
});
modalDialog.open(target);
}
});
add(modalDialog);
}
}
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.apache.org">
<head>
</head>
<body>
<wicket:panel>
<div class="col-md-1 text-right">
<a wicket:id="showDeleteDialog" class="btn fa fa-trash p24-2x deleteTrashIcon"></a>
</div>
<div wicket:id="modalWindow" class="modalDialog"></div>
</wicket:panel>
</body>
</html>
public abstract class ModalPanel extends Panel {
public ModalPanel(String id, Panel caller) {
super(id);
setOutputMarkupId(true);
add(new AjaxLink<Void>("cancelBtn") {
@Override
public void onClick(AjaxRequestTarget target) {
close(target);
}
});
}
protected abstract void close(AjaxRequestTarget target);
}
问题是模态对话框打开后,它的行为不像模态对话框。
有人用过 ModalDialog 吗,如果它对你有用,你可以分享你的经验吗?
我觉得你的代码没问题!
您可以将其与示例进行比较:
如果将 ModalDialog
与 Bootstrap 结合使用,您可能会在 Wicket ModalDialog
[=24] 使用的 modal-dialog
class 之间发生冲突=]模板和同名的Bootstrapclass。特别是,Bootstrap modal-dialog
class 关闭指针事件导致在模式对话框中单击无效。
要解决此问题,您可以将 Bootstrap modal-content
添加到 Wicket ModalDialog
内容元素:
add(new AjaxLink<Void>("showModalDialog") {
@Override
public void onClick(AjaxRequestTarget target) {
Panel content = new MyContentPanel("content");
content.add(AttributeModifier.append("class", "modal-content"));
modalDialog.open(content, target);
}
});
或者,您可以将 modal-content
class 添加到用于模式对话框内容的面板的 HTML 模板的根节点。