Html f.label内的嵌套输入(rails表单生成)

Html f.label内的嵌套输入(rails表单生成),html,ruby-on-rails,forms,label,Html,Ruby On Rails,Forms,Label,我想使用f.label方法创建表单元素标签,但是-我想将表单元素嵌套在标签中。这可能吗 --来自W3C-- 要隐式地将标签与另一个控件关联,控件元素必须位于label元素的内容内。在这种情况下,标签只能包含一个控件元素。标签本身可以放置在相关控件之前或之后 在本例中,我们将两个标签与两个文本输入控件隐式关联: 名字 姓 这不可能使用内置Rails的标签或标签标签助手,因为它们不占用块。但是,如果您想要嵌套,那么为什么不直接使用HTML元素呢- <label> <%=

我想使用f.label方法创建表单元素标签,但是-我想将表单元素嵌套在标签中。这可能吗

--来自W3C--

要隐式地将标签与另一个控件关联,控件元素必须位于label元素的内容内。在这种情况下,标签只能包含一个控件元素。标签本身可以放置在相关控件之前或之后

在本例中,我们将两个标签与两个文本输入控件隐式关联:



名字
姓


这不可能使用内置Rails的
标签
标签标签
助手,因为它们不占用块。但是,如果您想要嵌套,那么为什么不直接使用HTML元素呢-

<label>
  <%= f.text_field :firstname %>
</label>

您可以使用自定义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
class SmartLabelFormBuilder
然后,您可以像这样使用表单生成器:

<% form_for(@article, :builder => SmartLabelFormBuilder) do |form| %>
  <% form.label(:title) do %>
    Title
    <%= form.text_field(:title) %>
  <% end %>
<% end %>
SmartLabelFormBuilder)do | form |%>
标题

可以使用块将表单辅助对象嵌套在标签内。下面是一个使用HAML的示例,但它也适用于ERB

= form_for your_resource do |f|
  = f.label :first_name do
    = f.text_field :first_name

使用这个小方法

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

内容

正如前面提到的Dan Garland,您完全可以用一个简单的块将输入嵌套在标签中。我提供这个答案作为一个使用ERB的示例,特别是为了确切地说明当它们需要这种嵌套时,您必须如何获得。我花了一段时间才弄明白,希望这能帮助其他人

对于本例(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 %>


0.3英里 0.5英里 1英里

另外,我还不能发布屏幕截图来显示这是什么样子,但一旦我获得足够的代表分数,我就会发布。

这只是因为我想利用rails标签的自动化。rails的助手将输入元素的ID属性的值分配给标签元素的
for
属性。它不是特别复杂。无论您是使用Rails的助手还是将输入元素嵌套在标签中,效果都是相同的;在浏览器中单击标签将焦点设置为输入元素。这让我觉得Rails中存在巨大的疏忽,我真的很惊讶这一点没有得到解决。至少我们有像Tim Riley这样的人来帮助我们解决这个问题。我使用的是旧版本的Rails。这对我来说很有效,因为有时“帮助者”会妨碍你,编写你想要/需要的HTML代码比强迫Rails让你做你想做的事情更容易。包装很好,但它不会输出
for
属性,据我所知,普通的帮助者会这样做。也就是说,当我说
时,它输出
,但当我添加块时,它只输出
,不管我看起来做什么。我做错什么了吗?@BenSaufley:当标签包装输入元素时,for属性不是必需的。对不起,我以为这是在问关于Rails 3(3.2.9)的复选框是否用标签tagsWorks包装而没有HAML(普通erb)。谢谢!在没有haml的rails 4.0.4中工作。
<%= 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 %>