Question

I have a dialog that contain

<p:dialog id="sqlDialog" 
          widgetVar="sqlWidgetVar"
          header="SQL" 
          width="800"
          position="center"
          minimizable="true"
          maximizable="true"
          appendToBody="true"
          dynamic="true">
    <h:outputText id="sql" 
                  escape="false" 
                  value="#{bean.sql}" 
                  style="color: green"/>
</p:dialog>

Since the text is very long I need to add a scroll option

How can I do it ?

Thanks

Answer 1

Use CSS to make it a block element with fixed dimensions and an overflow.

<h:outputText ... styleClass="sqlDialogText" />

with

.sqlDialogText {
    display: block;
    width: 600px; /* Optional, depends otherwise on parent. */
    height: 300px;
    overflow: auto;
    color: green;
}

Alternatively, just give the dialog a fixed height.

<p:dialog ... height="300">

Note that this has nothing to do with JSF. It’s just a HTML/CSS/JS code generator. The <h:outputText> generates a HTML <span> element. You just have to alter the CSS accordingly for the look’n’feel.