Wednesday, July 17, 2013

How to create multiple lines message p:tooltip

From the PrimeFaces online demo, showing the usage of <p:tooltip /> component.
But all the samples displaying only single line message.
p:tooltip demo

Sometimes, the system requirements might need to display the message in multiple lines instead of just a long single line message.

this could be achieved by putting in a <h:panelGroup /> into the <p:tooltip /> component.
Then all content could be put inside the panelGroup, eg, <p:panel />, <p:graphicImage />, etc.


Sample Code:
<p:tooltip id="toolTipLnk" for="lnk">
    <h:panelGroup>
        <h:outputText value="this is line 1 message" /><br />
        <h:outputText value="this is line 2 message" /><br />
        <h:outputText value="this is line 3 message" />
    </h:panelGroup>
</p:tooltip>

Output:
p:tooltip with multiple lines message


Done!!

3 comments:

  1. Thanks so much!!!

    ReplyDelete
  2. Good Information, Excellent

    ReplyDelete
  3. With so many choices and potential settings in the more advanced massage chairs, it is essential that it offers an intuitive and simple to master method of control. portable massage chair

    ReplyDelete

LinkWithin

Related Posts Plugin for WordPress, Blogger...