web-dev-qa-db-ja.com

Primefacesダイアログボックスの幅と高さを修正する方法

私のWebアプリケーションでは、primefacesダイアログボックスの高さと幅を、ダイアログボックスがWebページの真ん中に表示されるように修正したいと考えています。ウィンドウを最小化したい場合は、ダイアログボックスも最小化する必要があります。私は、ウィンドウ全体ではなく、フレームの1つの中央を意味します。

つまり、％幅や高さなどの動的サイズのダイアログボックス

助けてくれてありがとう...

jsfprimefacesdialog
13
Annu

次のコードを使用して、固定寸法にすることができます。

<p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" width="300" height="200">  
    <h:outputText value="This is a Modal Dialog." />  
</p:dialog>

機能を最小限に抑えるため。あなたはそれを成し遂げるためにjavascriptで遊ぶことができます。

関連項目

19
Jigar Joshi

これを試して、属性スタイル（またはstyleclass）を使用してください：

<p:dialog ... modal="true" style="width:50% !important; height:40% !important; top:25% !important; left: 30% !important;">
  <!-- any components -->
</p:dialog>

もっと見る ここ 。

1
Máťa - Stitod.cz

P-dialogを使用している場合は、組み込みのstyleClass属性を使用します。

.my-style-class {
    width: 50%;
    height: 70%;
}
<p-dialog styleClass="my-style-class"><p-dialog>
1
nanoTitan

ダイアログを最小化するためにJSで高さを修正しようとしましたが、それでも大きなコンテンツでは機能しません。

<p:dialog widgetVar="dlg"
          header="header"
          modal="true"
          width="600"
          max-height="500"
          resizable="false"
          closeOnEscape="true"
          appendToBody="false"
          showEffect="clip"
          hideEffect="explode"
          onShow="PF('dlg').initPosition(); PF('dlg').getJQ().css('max-height', '500px');">
0
mwohlf