如何在primefaces中创建具有百分比高度的对话框答案

【问题标题】：How to create dialog with percentage height in primefaces如何在primefaces中创建具有百分比高度的对话框
【发布时间】：2015-07-07 13:16:20
【问题描述】：

我想在 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。这解释了为什么我的代码不起作用，但我可以做些什么来克服这个问题？

【问题讨论】：

【解决方案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%。

【讨论】：

【解决方案2】：

高度和宽度可能以像素为单位，尝试使用样式

<p:dialog ... style="width:70% !important; height:70% !important;">
   Some content
</p:dialog>

【讨论】：