Page 1 of 1

Tooltip For buttons and Icons

Posted: 02 Sep 2015, 16:58
by VH INFORMATICA LTDA
I need to show equals tooltips for all icons and buttons ...

My Button... (I need to show all equal as this!)
<p:commandButton id="cmdBut" icon="fa fa-facebook"/>
<p:tooltip id="ttBut" for="cmdBut" value="Tooltip"/>

My icon...
<i class="fa fa-facebook" title="Tooltip"/>

Re: Tooltip For buttons and Icons

Posted: 03 Sep 2015, 08:37
by mert.sincan
You can not use PrimeFaces Tooltip with html tags. When you add title attribute in a html tag, this tag is rendered by browser. Please try with h: or p: tags.
Also you can use global tooltip in your project;
//global tooltip
http://www.primefaces.org/showcase/ui/o ... obal.xhtml

//test code

Code: Select all

// please add in your page
..
xmlns:p="http://primefaces.org/ui"
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
...

// test 
<p:tooltip />

<p:commandButton id="cmdBut" icon="fa fa-facebook" pt:data-tooltip="Tooltip 1"/>
<h:link class="fa fa-facebook" pt:data-tooltip="Tooltip 2"/>

Re: Tooltip For buttons and Icons

Posted: 03 Sep 2015, 14:36
by VH INFORMATICA LTDA
Its works... but i need show tooltip only in icon, not in link...

Tanks.

Re: Tooltip For buttons and Icons

Posted: 03 Sep 2015, 14:43
by VH INFORMATICA LTDA
<p:tooltip/>

<h:graphicImage pt:data-tooltip="#{msgs.tooltip}">
<i class="fa fa-plus Fs20"/>
</h:graphicImage>

Re: Tooltip For buttons and Icons

Posted: 04 Sep 2015, 16:16
by mert.sincan
Sorry, I forgot globalSelector attribute in tooltip component. Please try with;

//CSS

Code: Select all

.TestClass:hover {
   cursor: pointer;
}
// XHTML

Code: Select all

<p:tooltip /> <!-- for pt: -->
<p:tooltip globalSelector=".TestClass" /> 

<i class="TestClass fa fa-plus Fs20" data-tooltip="Tooltip 2"/>
                                        
<p:commandButton id="cmdBut" icon="fa fa-facebook" style="margin-left:50px" pt:data-tooltip="Tooltip 1"/>

Re: Tooltip For buttons and Icons

Posted: 04 Sep 2015, 16:36
by VH INFORMATICA LTDA
Tanks its work!

Re: Tooltip For buttons and Icons

Posted: 04 Sep 2015, 16:45
by mert.sincan
Glad to hear, thanks ;)