Обертка <% = f.check_box%> внутри <label>
У меня есть список флажков в форме. Благодаря тому, что CSS структурирован, элемент ярлыка создается напрямую. Это требует, чтобы я установил флажок внутри тега.
Это работает в необработанном HTML, если вы нажмете на текст ярлыка, изменится состояние флажка. Однако он не работает с помощником rails <%= f.check_box %>
, поскольку он сначала выводит скрытый входной тег.
Таким образом,
<label>
<%= f.check_box :foo %>
Foo
</label>
это результат, который я хочу:
<label>
<input type="checkbox" ... />
<input type="hidden" ... />
Foo
</label>
... но это то, что дает мне рельсы:
<label>
<input type="hidden" ... />
<input type="checkbox" ... />
Foo
</label>
Таким образом, поведение меток на самом деле не работает: (.
Есть ли способ обойти это?
Ответы
Ответ 1
Rails генерирует скрытый ввод перед флажком, потому что ему нужен способ узнать, была ли форма отправлена с отмеченным флажком. Порядок чувствителен, поскольку флажок переопределяет скрытый ввод, если он был проверен. Подробнее см. Rails API.
Вы должны использовать <label for="checkbox_id">
вместо того, чтобы обернуть флажок в теге метки.
Ответ 2
Это работает для меня:
<%= f.label :foo do %>
<%= f.check_box :foo %>
Foo
<% end %>
Визуализирует:
<label for="foo">
<input name="foo" type="hidden" value="0">
<input checked="checked" id="foo" name="foo" type="checkbox" value="1">
Foo
</label>
Ответ 3
Это решение, которое я использовал, включая перевод.
<%=
f.label(
:foo,
"#{f.check_box(:foo)} #{t('helpers.label.foo')}".html_safe
)
%>
В en.yml
en:
helpers:
label:
foo: Foo
Ответ 4
Это не способ использовать тег label
. Вместо этого используйте его следующим образом:
<input type="hidden" ... /> <!-- doesn't really matter where these are -->
<label for="id_of_element">Foo</label>
<input type="checkbox" id="id_of_element" ... />
Теперь "Foo" действует как метка для элемента флажка, и вы можете нажать "Foo", чтобы проверить или снять флажок.