¿La etiqueta del botón de radio también hace la selección?

Question

De acuerdo con (algo oficial) this guide, puedo hacer que la etiqueta de un botón de opción también sea la selección para ese botón de opción. Dicen,

Utilice siempre las etiquetas para cada casilla de verificación y botón de opción. Ellos asocian texto con una opción específica y proporcionan una región más ampliable.

Desafortunadamente, no he podido obtener esta funcionalidad para mi formulario. Aquí está mi código:

<% 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 %> 

También he intentado esto (porque esta es la manera del ejemplo usando FormTagHelper en lugar 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 %> 

embargo, todavía no puede conseguir que funcione. Estoy usando Rails 2.3.5 y Ruby 1.8.7.

¡Gracias por leer y tal vez ayudar!

Answer 1

Una manera fácil de hacer esto para los botones de opción es colocar la etiqueta de entrada dentro de la etiqueta, así:

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

Esta es una forma válida de lograr su objetivo.

En Rails el ayudante label puede aceptar un bloque, por lo que podía hacer:

rieles

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

Answer 2

¡Vaya! Lo siento todo. Encontré el error de una manera poco sincera.

Escribí el código de esta publicación a mano ... sin copiar y pegar. Para mantener las cosas claras, cambié el nombre de algunos de los valores que usaba porque el código que estaba ejecutando era un poco desordenado (Y aparentemente incorrecto).

Entonces, cuando Gaby me pidió que obtuviera algunos resultados para estos fragmentos de código, los puse en mi punto de vista y ¡listo! ¡Etiquetas que seleccionan sus respectivos botones de radio! ¡¿Pero por qué?!

Bueno, aquí está la cosa. Al observar la salida, me di cuenta de que mi código original no había estado generando valores de entrada.id y etiqueta.para el html. Parecía algo como esto:

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

Esto generó:

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

Vea cómo input.id y label.for son diferentes?

Y solo cuando ejecuté el código en mi pregunta lo hice bien.

Parece que funciona así: el método de la etiqueta de botón de radio hace input.id de su (nombre_objeto + "_" + valor) y el método de etiqueta de etiqueta hace label.for de su nombre_objeto. Y cuando esos dos son iguales, obtienes una etiqueta de selección.

Espero que este descubrimiento pueda ayudar a alguien más a lo largo de la línea.

¡Perdón por hacer que tus engranajes también lo hagan!

Answer 3

No saber en absoluto, los requisitos HTML son fáciles: Debe crear sus etiquetas de la siguiente manera:

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

Así, en primer lugar, comprobar el código HTML, en su ejemplo, tenías cotizaciones desaparecidos en ... name = "bet_type type =" radio" ...

en segundo lugar, la de = "" siempre puntos un t la identificación del campo.

¡Ahora tiene una etiqueta en la que puede hacer clic para el campo bet_type!

Espero que ayude!

Answer 4

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

Answer 5

Puede encontrar una solución pero puede ayudar a otros. Estoy usando Rails 4+.

Puede hacer que la etiqueta se pueda hacer clic correctamente usando Rails' FormHelper's label method usando la clave "valor" en params.

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

Para su código, debe ser algo así como

<%= 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" %> 

Espero que ayude :)