Discussion :

[grb85]

Bonjour,

Je rencontre un problème lors de l'inclusion de div entre des radio buttons.


Voici le code introduit dans une facelet :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<h:selectOneRadio id ="size" value="4">
    <f:selectItem itemLabel="Small" itemValue="s"/>                           
                <div>Blabga1</div>
    <f:selectItem itemLabel="Medium" itemValue="m"/>
            <div>Blabla2</div>
    <f:selectItem itemLabel="Large" itemValue="l"/>
            <div>Blabla3</div>
    <f:selectItem itemLabel="Extra-Large" itemValue="xl"/>
            <div>Blabla4</div>
</h:selectOneRadio>

Et le code html généré :

<

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
div>Blabga1</div>
<div>Blabla2</div>
<div>Blabla3</div>
<div>Blabla4</div>
 
<table id="j_idt8:size">
	<tr>
<td>
<input type="radio" name="j_idt8:size" id="j_idt8:size:0" value="s" /><label for="j_idt8:size:0"> Small</label></td>
<td>
<input type="radio" name="j_idt8:size" id="j_idt8:size:1" value="m" /><label for="j_idt8:size:1"> Medium</label></td>
<td>
<input type="radio" name="j_idt8:size" id="j_idt8:size:2" value="l" /><label for="j_idt8:size:2"> Large</label></td>
 
<td>
<input type="radio" name="j_idt8:size" id="j_idt8:size:3" value="xl" /><label for="j_idt8:size:3"> Extra-Large</label></td>
	</tr>
</table>

Résultat : les div ont été sortis de ma table et placé au dessus.

L'idée est d'avoir, par l'intermédaire d'un javascript, le comportement suivant : lorsque l'utilisateur clique sur une radio button, le div qui doit se trouver juste en dessous soit affiché.

Quelqu'un a t'il une idée de solution ?

[Sniper37]

Pourquoi un div à l'intérieur de selectOneRadio ?
même pour un input type radio, je ne pense pas que ça fonctionne..

[grb85]

J'essaye de reproduire le comportement d'une maquette en html pur vers jsf.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
               <input type="radio" name="size" value="s"/> Small
        <div>Blabla1</div>
        <input type="radio" name="size" value="l"/> Large
        <div>Blabla2</div>

Il est vraiment important que chaque div soit situé en-dessous du radio button correspondante.

Ca me semble un peu gros que JSF ne prévoit pas ce genre de besoin.