调用 setVisible 后未显示 GWT-Bootstrap 模态

Question

我有一个简单的模式，我想在单击按钮时显示它。

这是我用来显示模态的代码

@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.");
    }
}

即使模态没有显示在屏幕上，登录到控制台的消息是前者，即成功显示模态！

我用 firebug 进行了一些挖掘，在单击按钮之前呈现的 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> 

Answer 1

您需要在 GWT-Bootstrap 模态对象上调用 show() 方法来显示它。

更新：

在ui.xml文件中，为modal分配一个id。

<b:Modal title="VipName" ui:field="vipNameModel" backdrop="STATIC">

在 ModalDialogDemo.JAVA 文件中，获取该对象。

@UiField
    Modal vipNameModel;

创建getter方法：

Modal getVipNameModel()
{
return vipNameModel'
}

然后从 ModalDialogDemo 类调用 modalDialog.getVipNameModel().show();