<h:selectOneRadio> rend l'élément de tableau, comment l'éviter?

Est-il un moyen de dire JSF qu'il ne doit PAS rendre une <table> élément lors de l'utilisation de <h:selectOneRadio>?
Je n'utilise pas de tableaux et il n'a absolument aucun sens dans ce cas.

Toute aide est très appréciée!

OriginalL'auteur m4ri0 | 2011-09-15

JSF 2.3 avec `group` attribut

Comme par JSF éd. 329 j'ai ajouté un nouveau group attribut <h:selectOneRadio> qui devrait rendre le tout beaucoup moins fastidieux. Tous les bouton radio composants ayant la même group valeur à l'intérieur d'un parent UIForm seront regroupés les uns avec les autres. Aussi, ils ne sont pas rendues de balisage en plus le bouton radio à lui-même et l'étiquette facultative si la sélection de l'élément a une valeur non nulle label. Le cas échéant, l'étiquette s'affiche directement après le radio bouton.

<!-- Just markup them the way you want! -->
<ul>
    <ui:repeat id="items" value="#{bean.items}" var="item">
        <li>
            <h:selectOneRadio group="foo" value="#{bean.selectedItem}">
                <f:selectItem itemValue="#{item}" />
            </h:selectOneRadio>
        </li>
    </ui:repeat>
</ul>

Scénarios suivants sont également possibles. Lorsqu'il y a plusieurs composants avec le même group, et la value attribut et/ou UISelectItem enfant est absent, il fera référence à ceux de la première composante du groupe.

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItems value="#{bean.availableItems}" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" />
<h:selectOneRadio group="foo" />

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
    <f:selectItem itemValue="two" />
    <f:selectItem itemValue="three" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" />
<h:selectOneRadio group="foo" />

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
</h:selectOneRadio>
<h:selectOneRadio group="foo">
    <f:selectItem itemValue="two" />
</h:selectOneRadio>
<h:selectOneRadio group="foo">
    <f:selectItem itemValue="three" />
</h:selectOneRadio>

<h:selectOneRadio group="foo" value="#{bean.selectedItem}">
    <f:selectItem itemValue="one" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" value="#{otherBean.selectedItem}">
    <f:selectItem itemValue="two" />
</h:selectOneRadio>
<h:selectOneRadio group="foo" value="#{lastBean.selectedItem}">
    <f:selectItem itemValue="three" />
</h:selectOneRadio>

Il sera disponible en Mojarra comme par 2.3.0-m07.

JSF 2.2 avec passthrough éléments

Si vous êtes sur JSF 2.2 déjà, faire usage de ses nouveaux passthrough éléments/attribtues fonction de laquelle vous définissez explicitement le name attribut comme un relais de l'attribut. Afin de définir la valeur soumises dans le modèle, vous avez seulement besoin d'un supplément de <h:inputHidden>.

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:jsf="http://xmlns.jcp.org/jsf"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:a="http://xmlns.jcp.org/jsf/passthrough">

...

<!-- Just markup them the way you want! -->
<ul>
    <ui:repeat id="items" value="#{bean.items}" var="item">
        <li>
            <input type="radio" jsf:id="item" a:name="#{hiddenItem.clientId}"
                value="#{item}" a:checked="#{item eq bean.selectedItem ? 'checked' : null}" />
            <h:outputLabel for="item" value="#{item}" />
        </li>
    </ui:repeat>
</ul>

<!-- This one won't display anything. -->
<h:inputHidden id="selectedItem" binding="#{hiddenItem}" value="#{bean.selectedItem}"
    rendered="#{facesContext.currentPhaseId.ordinal ne 6}" />

En profondeur la technique de l'explication peut être trouvée dans ce blog: Mise en page personnalisée avec h:selectOneRadio dans JSF 2.2.

PrimeFaces (JSF 2.x)

Si vous arrive d'utiliser PrimeFaces, alors vous pouvez aussi utiliser <p:selectOneRadio layout="custom"> avec <p:radioButton>.

<html ... xmlns:p="http://primefaces.org/ui">

<!-- This one won't display anything. -->
<p:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="custom">
    <f:selectItems value="#{bean.availableFoos}" />
</p:selectOneRadio>

<!-- Just markup them the way you want! -->
<ul>
    <li><p:radioButton for="foo" itemIndex="0" /></li>
    <li><p:radioButton for="foo" itemIndex="1" /></li>
    <li><p:radioButton for="foo" itemIndex="2" /></li>
</ul>

Vous pouvez également en boucle sur les éléments disponibles, vous ne devez le faire qu'au cours de vue le temps de construction:

<ul>
    <c:forEach items="#{bean.availableFoos}" varStatus="loop">
        <li><p:radioButton for="foo" itemIndex="#{loop.index}" /></li>
    </c:forEach>
</ul>

Tomahawk (JSF 1.x ou 2.x)

Si vous n'êtes pas sur JSF 2.2 ou encore si vous n'aimez pas PrimeFaces de l'INTERFACE utilisateur, prenez Tomahawk est <t:selectOneRadio> qui rend la même plaine de la sortie HTML comme <h:selectOneRadio>, mais prend en charge un layout="spread" attribut de sorte que vous pouvez positionner les éléments par <t:radio> la façon dont vous le souhaitez.

E. g.

<html ... xmlns:t="http://myfaces.apache.org/tomahawk">

<!-- This one won't display anything. -->
<t:selectOneRadio id="foo" value="#{bean.selectedFoo}" layout="spread">
    <f:selectItems value="#{bean.availableFoos}" />
</t:selectOneRadio>

<!-- Just markup them the way you want! -->
<ul>
    <li><t:radio for="foo" index="0" /></li>
    <li><t:radio for="foo" index="1" /></li>
    <li><t:radio for="foo" index="2" /></li>
</ul>

Personnalisé Convertisseur

Offre personnalisée Rendu. C'est seulement un peu de travail. Commencer lors de la première "Voir aussi" lien ci-dessous:

Voir aussi:

Merci beaucoup!! Il fonctionne très bien...
Dans votre deuxième PrimeFaces solution (l'un avec le forEach), comment voulez-vous ajouter des étiquettes pour les boutons de la radio? Je n'arrive pas à obtenir l'id de l'respectives input éléments de référence dans un h:outputLabel élément.
utiliser, par exemple,id="foo_#{loop.index}". Voir aussi un.o. stackoverflow.com/q/3342984
En utilisant cette approche, seuls les enfermant div du bouton radio est référencé, comme ceci:

<div id="cQueryEditor:opt_2" class="ui-radiobutton ui-radiobutton-native ui-widget">...</div> <label for="cQueryEditor:opt_2">...</label>

. Btw, je suis en utilisant PrimeFaces' style ordinaire.
J'ai téléchargé cette application:mvnrepository.com/artifact/com.sun.faces/jsf-impl/2.2.13 mais je ne trouve pas le taglib.xml fichier de l'espace de noms: relais. Seulement compsoite, facelets, html_basic, jstl-core jstl-fn, mojarra_ext et l'interface utilisateur est ici. Où dois-passthrough être?

OriginalL'auteur BalusC

je ne sais pas si c'est assez raisonnable pour vous, mais voici un exemple de travail autour de.

code xhtml:

<ui:repeat value="#{myBean.valueList}" var="radioValue">
    <input type="radio" name="radioSelection" value="#{radioValue}" checked="#{radioValue == myBean.selectedRadioValue ? 'checked' : ''}">#{radioValue}</input>
</ui:repeat>

backing bean:

    private String selectedRadioValue;

    private List<Integer> valueList;

    public MyBean() {
        valueList = new ArrayList<Integer>();
        for (int i = 0; i < 15; i++) {
            valueList.add(i);
        }
    }

    public String getSelectedRadioValue() {
        return selectedRadioValue;
    }

    public List<Integer> getValueList() {
        return valueList;
    }

    public void actionMethod() {
        HttpServletRequest request = (HttpServletRequest)FacesContext.getCurrentInstance().getExternalContext().getRequest();
        selectedRadioValue = request.getParameter("radioSelection");
    }

puisque vous ne pouvez pas affecter une valeur à la radio de sélection directement sur le xhtml, vous avez besoin pour obtenir à partir de paramètres de la requête et de l'attribuer manuellement dans votre méthode d'action.

OriginalL'auteur tt_emrah

Vous devez vous connecter pour publier un commentaire.

JSF 2.3 avec group attribut