h: selectOneRadio contenant des images

J'ai ah: tag selectOneRadio pour afficher un certain nombre de radiobuttons:h: selectOneRadio contenant des images

<h:selectOneRadio value="#{myBean.radioButtonSelection}"> 
    <s:selectItems value="#{myBean.getPossibleRadioButtonSelections()}" var="rs" label="#{rs.toString}"/>        
</h:selectOneRadio>

Maintenant, au lieu de radiobuttons je avec des valeurs de chaîne (étiquettes), comme avoir des boutons radio avec (cliquable) des images à côté d'elle. Est-ce possible? Si c'est le cas, comment?

Mise à jour: En fait, il doit y avoir à la fois du texte et une image avec un point d'interrogation qui affiche un panneau modal lorsqu'on clique dessus.

Source

2010-08-25 Fortega

Vous pouvez utiliser <h:outputLabel for="form:radioGroupId:X"> et placer un <h:graphicImage> à l'intérieur. (X est le numéro de l'option)

Bien sûr, vous devez avoir deux collections - une avec les éléments, et une avec les images, et les itérer séparément - une avec <s:selectItems> et l'autre avec <ui:repeat>. Un peu ennuyeux.

Source

2010-08-25 13:50:20 Bozho

Comment l'aligner avec 's: selectItems'? – BalusC

en utilisant 'ui: repeat', c'est-à-dire manuellement. – Bozho

J'ai fait quelque chose de similaire à votre solution. Le h: selectOneRadio crée une table, j'ai donc créé une deuxième table à côté (en utilisant ), contenant les images ... Cela fonctionne et a l'air bien, bien que le code html généré ne soit pas très joli ... – Fortega

Votre meilleure et la plus propre mise serait d'utiliser des images de fond CSS. Vous pouvez également définir itemLabelEscaped="false" et utiliser le code HTML <img> dans l'étiquette d'élément.

Source

2010-08-25 13:37:16 BalusC

images de fond CSS cliquables? J'ai en fait besoin de s, donc je peux montrer un panneau modal quand quelqu'un clique dessus. Je ne pense pas que ce serait possible avec une image de fond. – Fortega

Ensuite, allez pour le HTML. – BalusC

Je suis confronté au même problème (je veux ajouter une icône d'aide à certaines de mes options) mais je n'arrive pas à trouver une solution élégante ... Si je vous comprends bien, l'approche html consiste à déplacer des éléments visuels dans les beans backing, où les étiquettes pour les selectItems sont générés, non? – Louise

h: selectOneRadio contenant des images

Répondre

Questions connexes