我有一个简单的模式,我想在单击按钮时显示它。
这是我用来显示模态的代码
@UiHandler("submit")
void handleClick(ClickEvent e){
ModalDialogDemo modalDialog = (ModalDialogDemo) RootPanel.get().getWidget(2);
modalDialog.setHeight("200px");
modalDialog.setWidth("100px");
modalDialog.setVisible(true);
if(modalDialog.isVisible()){
System.out.println("Successfully Displayed the Modal!");
}
else{
System.out.println("Something went wrong.");
}
}
即使模态没有显示在屏幕上,登录到控制台的消息是前者,即成功显示模态!
我用萤火虫做了一些挖掘,在单击按钮之前,呈现的 HTML 是
<div>
<div class="modal" style="display: none;" aria-hidden="true">
<div class="modal-header"><a class="close" data-dismiss="modal">×</a><h3>Name</h3></div>
<div class="modal-body"><div class="gwt-Label">Modal Content Comes Here</div></div>
<div class="modal-footer"><div class="gwt-Label">And this is the footer</div></div></div>
</div>
单击按钮后,它变为
<div style="height: 200px; width: 100px;" aria-hidden="false">
<div class="modal" style="display: none;" aria-hidden="true">
<div class="modal-header"><a class="close" data-dismiss="modal">×</a><h3>Name</h3></div>
<div class="modal-body"><div class="gwt-Label">Modal Content Comes Here</div></div>
<div class="modal-footer"><div class="gwt-Label">And this is the footer</div></div></div>
</div>
第一个 div 具有我设置的高度和宽度,并且 aria-hidden 也被清除,但实际包含模态的子 div 不受影响。
我不知道如何告诉 GWT 也将更改应用到子 div,有人可以帮我解决这个问题吗?
编辑:这是我的 ModalDialogDemo.ui.xml
<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui"
xmlns:b = "urn:import:com.github.gwtbootstrap.client.ui">
<g:HTMLPanel>
<b:Modal title="VipName" backdrop="STATIC">
<g:Label>Modal Content Comes Here</g:Label>
<b:ModalFooter>
<g:Label>And this is the footer</g:Label>
</b:ModalFooter>
</b:Modal>
</g:HTMLPanel>
</ui:UiBinder>