jsf-2 - 如何在 primefaces 中创建具有百分比高度的对话框

Question

我想在 primefaces 中创建一个 p:dialog 组件，其大小以百分比给出:

<p:dialog header="Dialog" widgetVar="dlg" width="70%" height="70%">
  Some content
</p:dialog>

上面的代码创建了一个具有正确宽度值的组件。但是，对话框的高度设置为某个非常小的值(绝对不是 70%)。

我的问题是:如何为对话框设置百分比高度？

我做了一些研究，在 primefaces 代码中发现 height 值明确为 set to 'auto'高度属性是 assigned to content div .这解释了为什么我的代码不起作用，但我可以做些什么来克服这个问题？

Answer 1

我找到了一种使用 javascript 来完成它的方法。应该修改组件定义:

<p:dialog id="dialog" header="Dialog" widgetVar="dlg" width="70%" height="100%">
  Some content
</p:dialog>

这样内容就会完全填满对话框。现在应该调用以下 javascipt 代码:

var htmlTag = document.getElementById('dialog');
htmlTag.style.height = Math.floor(window.innerHeight*0.7)+"px";

这会将对话框高度调整为窗口高度的 70%。