Primefaces commandbutton to add image not working

0
votes

enter image description here

I'm add user defined image commandbutton button its not working.I try to below code:

 <p:commandButton id="addMoreButton" value=""
  action="#{ContactDetails.addMoreButtonAction}" image="#{General.image}"/>

In replace of image to use icon attribute icon="addMoreImageButton" but it also not working. css:

.addMoreImageButton
            {
                 background-image: url("#{GeneralPageAttributes.addMoreImageButton}");            
            }

I need only image in button not text then what attribute to choosen it.

1
jsfprimefaces
What is not working ? what are you seeing and what do you want to see ? – Shahzeb
specify image not show in commandbutton. It only show ^ symbol – user4844620
open it in chrome and right click inspect. See if the image URL is correct – Shahzeb
Is there a perfect image link in #{General.image}? – Parkash Kumar
@Parkash Kumar link is come from bean (/faces/resources/images/AddIcon.png) – user4844620

1 Answers

2
votes

There are following ways, you can create a image button: (Tested Code)

[Using commandButton]

<p:commandButton id="addMoreButton" value="" action="#" 
    image="http://c.dryicons.com/images/icon_sets/christmas_surprise_four_in_one/png/128x128/frost_button.png" />

If the 'image' attribute for commandButton is specified, button will be of type image without any text on it, even if the 'value' attribute is specified with some String.

[Using commandLink]

<p:commandLink id="addMoreButton1" value="" action="#">
    <p:graphicImage url="http://c.dryicons.com/images/icon_sets/christmas_surprise_four_in_one/png/128x128/frost_button.png" />
</p:commandLink>

Use your bean action in place of #. Also specify styleClass or style attribute to further beautify your controls.