java - 以编程方式调整ZK模式的大小

我有一个名为loginModal的模式，其中包含一个iframe

<window id="loginModal" title="Login" border="normal" position="center,top" closable="true" width="500px" height="350px" >
    <iframe src="/usermenu.zul"  id="iframeLogin" scrolling="false" width="100%" height="100%"/>
</window>

iframe会调用页面用户菜单。在某些情况下，用户菜单可能会重定向到内容大于模式的验证页面。我想找到一种方法，当执行重定向时，我可以调整模式的大小以使其自动变大。

请注意，getParent返回null，并且不会将模式对象返回给我。

到达验证页面时，我尝试将消息发送到loginModal。消息已收到，但我无法通过javascript调整模式的大小。

在验证页面

<script type="text/javascript">
window.parent.postMessage('verification','*');
</script>

在loginModal中

<script type="text/javascript">
window.addEventListener('message', receiveMessage, false);

function receiveMessage(evt) {

    if (evt.data == 'verification') {
        loginModal.height = 500;
    }
}
</script>

我尝试了几种设置高度的方法，但均无效果。我知道消息已到达loginModal，因为我可以发送警报。
任何帮助，将不胜感激。谢谢

最佳答案

ZK所做的是它将一个页面上的loginModal页面加载到另一个桌面上的iframeLogin页面。 here进一步阐明了桌面的概念。

因此，loginModal不是iframeLogin的父浏览器窗口。这就是在iframe上调用getParent时返回null的原因。

如ZK Component Reference中所述，可能无法访问连接到其他桌面的组件。换句话说，loginModal和iframeLogin之间的信息交换被禁用。

看来您有两种选择之一：


不要使用iframe，而是使用include。
使用iframe，但在组范围内定义Event Queue。使此事件队列对loginModal和iframeLogin均可见，并使用它在您拥有的两个桌面之间交换信息。


编辑1

请确保：


客户端名称空间通过插入合并
xmlns:w="http://www.zkoss.org/2005/zk/client"放入您的window
标签。
通过在defer="true"标记中插入script创建所有小部件后，将评估您的JS代码。


在您的第二个JS代码段中，this引用script小部件本身。您的window和script在同一个ID space中共存。换句话说，您的window和script是伙伴。

因此，要从window引用script，请使用以下任一方法：

this.$f('loginModal').setHeight("500px");
this.$f().loginModal.setHeight("500px");
zk.Widget.$(jq('$loginModal')[0]).setHeight("500px");

代替：

loginModal.height = 500;

编辑2

为了进一步举例说明，以下JS script将使loginModal的初始高度加倍：

<window id="loginModal" title="Login" border="normal" width="500px" height="350px" xmlns:w="http://www.zkoss.org/2005/zk/client">
    <script defer="true">
        this.$f('loginModal').setHeight("700px");
    </script>
</window>