L'étiquette du bouton radio est-elle également sélectionnée?

Question

Selon (un peu officiel) this guide, je peux faire l'étiquette d'un bouton radio faire la sélection pour ce bouton radio aussi. Ils disent,

Toujours utiliser des étiquettes pour chaque case à cocher et bouton radio. Ils texte associé avec une option spécifique et fournissent une plus grande région cliquable.

Malheureusement, je n'ai pas été en mesure d'obtenir cette fonctionnalité pour mon formulaire. Voici mon code:

<% form_for(@bet) do |f| %> 
    <%= f.label :bet_type %> 
    <%= f.radio_button :bet_type, "moneyline" %> 
    <%= f.label :bet_type_moneyline, "Moneyline" %> 
    <%= f.radio_button :bet_type, "spread" %> 
    <%= f.label :bet_type_spread, "Spread" %> 
<% end %> 

J'ai aussi essayé ce (parce que c'est la façon d'exemple à l'aide FormTagHelper au lieu de FormHelper):

<% form_for(@bet) do |f| %> 
    <%= radio_button_tag :bet_type, "moneyline" %> 
    <%= label_tag :bet_type_moneyline, "Moneyline" %> 
    <%= radio_button_tag :bet_type, "spread" %> 
    <%= label_tag :bet_type_spread, "Spread" %> 
<% end %> 

Mais, je ne peux toujours pas à travailler. J'utilise les rails 2.3.5 et ruby ​​1.8.7.

Merci d'avoir lu, et peut-être aider!

Answer 1

Un moyen facile de le faire pour les boutons radio est de placer l'étiquette d'entrée à l'intérieur de l'étiquette, comme ceci:

<label> 
    <input /> 
    This is an input! 
</label> 

C'est un moyen valable d'accomplir votre objectif.

Dans Rails l'aide label peut accepter un bloc, vous pouvez donc faire:

<%= f.label :moneyline do %> 
    <%= f.radio_button :bet_type, "moneyline" %> 
    "Moneyline" 
<% end %> 

Answer 2

Woops! Désolé tout. J'ai trouvé l'erreur d'une manière un peu déloyale.

J'ai écrit le code de ce billet à la main ... pas de copier-coller. Pour garder les choses claires, j'ai renommé certaines des valeurs que j'ai utilisées parce que le code que j'utilisais était un peu brouillon (ET apparemment incorrect). Donc, quand Gaby m'a demandé d'obtenir une sortie pour ces morceaux de code, je les ai collés à mon avis et voila! Les étiquettes qui sélectionnent leurs boutons radio respectifs! Mais pourquoi?!

Eh bien, voici la chose. En regardant la sortie, j'ai réalisé que mon code original ne générait pas de valeurs cohérentes input.id et label.for dans le HTML. Il avait l'air quelque chose comme ceci:

<%= f.radio_button :bet_type, "moneyline" %> 
<%= f.label :moneyline, "Moneyline" %> 

Cela a généré:

<input id="bet_type_moneyline" name="bet_type type="radio" value="moneyline" /> 
<label for="moneyline">Moneyline</label> 

Voyez comment input.id et label.for sont différents?

Et seulement quand j'ai couru le code dans ma question ai-je obtenu ce droit.

Cela semble fonctionner comme ceci: la méthode de l'étiquette de bouton radio fait input.id de son (nom_objet + "_" + valeur) et la méthode d'étiquette étiquette fait label.for de son nom_objet. Et lorsque ces deux égaux, vous obtenez une étiquette de sélection. J'espère que cette découverte peut aider quelqu'un d'autre sur la ligne.

Désolé de faire broyer vos vitesses pour rien!

Answer 3

ne sachant rails du tout, les exigences HTML sont faciles: Vous devez construire vos balises comme ceci:

<input id="bet_type_moneyline" name="bet_type" type="radio" value="moneyline"> 
<label for="bet_type_moneyline">Moneyline</label> 

Ainsi, tout d'abord, vérifiez votre code HTML, dans votre exemple, vous aviez des citations manquantes dans ... name = "type = bet_type" radio » ...

en second lieu, le for = "" toujours des points une t l'identifiant du champ.

Vous avez maintenant une étiquette cliquable pour le champ bet_type!

J'espère que ça aide!

Answer 4

<%= f.radio_button :bet_type, "moneyline" %> 
<%= f.label :moneyline, "Moneyline", :for => "bet_type_moneyline" %> 

Answer 5

Vous pouvez trouver une solution mais cela peut aider d'autres personnes. J'utilise Rails 4+.

Vous pouvez rendre l'étiquette cliquable correctement en utilisant Rails' FormHelper's label method en utilisant la touche "value" dans les paramètres.

label(:post, :privacy, "Public Post", value: "public") 
# => <label for="post_privacy_public">Public Post</label> 

Pour votre code, il devrait être quelque chose comme

<%= f.radio_button :bet_type, "moneyline" %> 
<%= f.label :bet_type, "Moneyline", value: "moneyline" %> 
<%= f.radio_button :bet_type, "spread" %> 
<%= f.label :bet_type, "Spread", value: "spread" %> 

it helps :)