jsf - <p:selectOneButton> with images -


i'm using jsf primefaces, want use buttonset of radiobutton images can't make work.

here's code:

    <p:selectonebutton value="#{loginbean.user}" >           <f:selectitem itemlabel="&lt;img src=&quot;/myapp/faces/javax.faces.resource/myimg1.png?ln=img&quot;/&gt;" itemvalue="1"/>         <f:selectitem itemlabel="&lt;img src=&quot;/myapp/faces/javax.faces.resource/myimg2.png?ln=img&quot;/&gt;" itemvalue="2"/>     </p:selectonebutton> 

i tried escaping characters "escape", "escapeitem" , "itemescaped" attributes. read last 1 in other question. solution in question uses <h:selectoneradio>, not <p:selectonebutton>.

note: know works using jqueryui buttonset() method (primefaces uses on background) it's not script problem..

so, posible <p:selectonebutton>?

thanks!

indeed, renderer of <p:selectonebutton> doesn't take account html in labels. best bet set css background image instead.

given

<p:selectonebutton ... styleclass="buttons"> 

you can style individual buttons using css3 :nth-child() pseudoselector

.buttons .ui-button:nth-child(1) {     background: url("#{resource['img/myimg1.png']}") no-repeat; } .buttons .ui-button:nth-child(2) {     background: url("#{resource['img/myimg2.png']}") no-repeat; } 

if you're targeting browsers don't support (certain ie versions), can't go around performing job via js/jquery.

$(".buttons .ui-button:eq(0)").css("background", "url('resources/img/myimg1.png') no-repeat"); $(".buttons .ui-button:eq(1)").css("background", "url('resources/img/myimg2.png') no-repeat"); 

unrelated concrete problem, way how you're using resource library not entirely right. read what jsf resource library , how should used? learn more it.


Comments

Popular posts from this blog

Hatching array of circles in AutoCAD using c# -

ios - UITEXTFIELD InputView Uipicker not working in swift -

Python Pig Latin Translator -