6.09.2013

In this short article I will show how to insert the line break inside the Primefaces component's value.

Let's imagine that we need to insert the line break in the value of the column in <p:dataTable>. 

The simple code without line break:

<p:dataTable var="val" value="#{testMB.list}" paginator="true" rows="10" paginatorPosition="bottom" editable="true">
<p:column style="width:7%" headerText="Column1">
      <p:cellEditor>
            <f:facet name="output"><h:outputText value="#{val.val1}"/></f:facet>
       </p:cellEditor>
</p:column>
...
</p:dataTable>


So, as you can see, I got <h:outputText> value from the managed bean. This value is one-line string. 
Now we need to put some text in this value, but after the break. In this case we need to use escape charackter "&#10;". Also in order to accept this charackter we need to set "false" for the "escape" property and use "white-space:pre-line;" CSS property.

<p:dataTable var="val" value="#{testMB.list}" paginator="true" rows="10" paginatorPosition="bottom" editable="true">
<p:column style="width:7%" headerText="Column1">
      <p:cellEditor>
            <f:facet name="output"><h:outputText style="white-space:pre-line" escape="false" value="#{val.val1} &#10; 2013-06"/></f:facet>
       </p:cellEditor>
</p:column>
...
</p:dataTable>

That is all. Now you will see that "2013-06" value is printed from the new line.

1 коммент.:

Subscribe to RSS Feed Follow me on Twitter!