This week's giveaway is in the Android forum.
We're giving away four copies of Android Security Essentials Live Lessons and have Godfrey Nolan on-line!
See this thread for details.
The moose likes JSF and the fly likes How insert image to primefaces commandbutton? Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Android Security Essentials Live Lessons this week in the Android forum!
JavaRanch » Java Forums » Java » JSF
Bookmark "How insert image to primefaces commandbutton?" Watch "How insert image to primefaces commandbutton?" New topic
Author

How insert image to primefaces commandbutton?

D. Formenton
Ranch Hand

Joined: Mar 20, 2008
Posts: 47
Hi,

I have some problem to insert an image to a <p:commandButton>.

Someone can show me a complete example?

My situation is:

IDE: NetBeans 7.1
Primefaces v. 2.2.1
<project>
/web Pages/resources/css/images.css
/Web pages/resources/images/Save.png

The file images.css contains only:

.save{
background-image: url("images/Save.png") !important;
}


in the JSF page:

....
<h:head>
<title>Inserimento Persona</title>
<hutputStylesheet name="css/jsfcrud.css"/>
<hutputStylesheet name="css/images.css"/>
</h:head>
....
<p:toolbar>
<p:toolbarGroup align="left">
<p:commandButton type="button" image="save"/>
</p:toolbarGroup>
</p:toolbar>

Where is the error(s)?

Thank you.

Anatoly Kondratyev
Greenhorn

Joined: Nov 20, 2011
Posts: 1
Hello, I run into the same problem and didn't find a lot workaround.

Anyway, I suggest to look through this link Changing the image of a h:commandButton using CSS

In brief, for your case:
CSS


XHTML


First 2 buttons are Primefaces, the last one is not.

In output first button will be strange, with "^" symbol on it. (It is bad)
Last two will be normal, with specified image on it. The problem for primefaces button is that image will be replaced with white background when mouse is over.
At the moment I'm looking for solution to this problem. Any suggestions will be welcome)

And sorry for my English, please.
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: How insert image to primefaces commandbutton?
 
Similar Threads
locating the JSF resources directory
h:outputStylesheet link ordering
Primefaces datatable CSS?
SessionAffinityManager setCookie SESN0066E: The response is already committed to the client.
project file structure for web application (war).