Гнездовой ввод внутри f.label (поколение рельсов) - PullRequest
18 голосов
/ 16 марта 2010

Я хочу использовать метод f.label для создания меток элементов формы, однако я хочу, чтобы элемент формы был вложен в метку. Это возможно?

- из W3C -

Чтобы неявно связать метку с другим элементом управления, элемент управления должен находиться внутри содержимого элемента LABEL. В этом случае LABEL может содержать только один элемент управления. Сам ярлык может располагаться до или после соответствующего элемента управления.

В этом примере мы неявно связываем две метки с двумя элементами управления вводом текста:

<form action="..." method="post">
 <p>
  <label>
     First Name
     <input type="text" name="firstname" />
  </label>
  <label>
     <input type="text" name="lastname" />
     Last Name
  </label>
  </p>
</form>

Ответы [ 5 ]

23 голосов
/ 10 января 2012

Вы можете вложить свой помощник формы в метку, используя блок. Вот пример использования HAML, но он также работает с ERB.

= form_for your_resource do |f|
  = f.label :first_name do
    = f.text_field :first_name
9 голосов
/ 01 сентября 2015

Как уже упоминалось выше, Дэн Гарланд, вы можете определенно вкладывать входные данные в метки с помощью простого блока. Я привожу этот ответ в качестве примера с использованием ERB и специально для того, чтобы показать, как именно вы должны получить группы кнопок Bootstrap для работы подобно переключателям , так как они требуют этого вложения. Мне потребовалось некоторое время, чтобы понять, так что, надеюсь, это поможет кому-то еще.

Для этого примера (Rails 4.2) группа кнопок позволяет пользователю выбирать между 3 различными вариантами расстояния:

<%= form_for(@location) do |f| %>
  <div class="field form-group">
    <%= f.label :distance %><br>
    <div class="btn-group" data-toggle="buttons">
      <%= f.label :distance, class: "btn btn-primary active" do %>
        <%= f.radio_button :distance, 0.3, checked: true %>
        0.3 miles
      <% end %>
      <%= f.label :distance, class: "btn btn-primary" do %>
        <%= f.radio_button :distance, 0.5 %>
        0.5 miles
      <% end %>
      <%= f.label :distance, class: "btn btn-primary" do %>
        <%= f.radio_button :distance, 1 %>
        1 mile
      <% end %>
    </div>
  </div>
  <div class="actions">
    <%= f.submit "Submit Location", class: "btn btn-success" %>
  </div>
<% end %>

P.S. Я пока не могу опубликовать скриншоты, чтобы показать, как это выглядит, но как только я получу достаточно очков репутации, я это сделаю.

8 голосов
/ 04 апреля 2010

Вы можете использовать пользовательский FormBuilder, чтобы помощник метки мог принять блок. Это так просто:

class SmartLabelFormBuilder < ActionView::Helpers::FormBuilder
  def label(method, content_or_options_with_block = nil, options = {}, &block)
    if !block_given?
      super(method, content_or_options_with_block, options)
    else
      options = content_or_options_with_block.is_a?(Hash) ? content_or_options_with_block.stringify_keys : {}

      @template.content_tag(:label, options, &block)
    end
  end
end

Тогда вы можете использовать свой конструктор форм следующим образом:

<% form_for(@article, :builder => SmartLabelFormBuilder) do |form| %>
  <% form.label(:title) do %>
    Title
    <%= form.text_field(:title) %>
  <% end %>
<% end %>
2 голосов
/ 24 августа 2012

Используйте этот маленький обходной путь

<%= f.label(:content, "#{f.check_box(:allow_posts)}\n#{:content}\n".html_safe, :class => "checkbox") %>

даст вам это

<label class="checkbox" for="pages_content"><input name="pages[allow_posts]" type="hidden" value="0"><input id="pages_allow_posts" name="pages[allow_posts]" type="checkbox" value="1">

содержание

1 голос
/ 16 марта 2010

Это невозможно, используя встроенные в Rails помощники label или label_tag, потому что они не занимают блок. Однако если вы хотите вложить, то почему бы просто не использовать элемент HTML напрямую? & Mdash;

<label>
  <%= f.text_field :firstname %>
</label>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...