简单的表单关联与默认输入类型冲突

我有一个简单的表单。一切工作都很好，直到我想要添加关联表单。该协会本身运作良好，所以我会跳过这一点。保存数据的作品。问题在于异常情况下输入类的控制。简单的表单关联与默认输入类型冲突

<%= simple_form_for @fabmoment do |f| %> 
 
     \t 
 
    <%= f.input_field :title %> 
 
    <%= f.label :title %> 
 
    <%= f.error :title %> 
 
    <%= f.input_field :description, rows: 7 %> 
 
    <%= f.label :description %> 
 
    <%= f.error :description %><br><br> 
 
    <%= f.association :machines, as: :check_boxes, 
 
           :label_method => lambda { |m| " #{m.name}" } %> 
 
    
 
<% end %>

正如你看到的，我在这里我把什么很具体的，这是因为我的CSS库（W3.CSS）的。问题是，在我的初始化程序中，我将"w3-input"的类作为输入的默认值。但是这不适用于我的关联复选框。目前我看到标签和输入复选框不是内联的。

如果"w3-input"类不在那里，情况就不会如此。但我无法删除它，我只能像item_wrapper_tag和item_wrapper_class一样深。

这个他非常讨厌。我昨天一直忙于此。

为什么我不能做这样的事情：

<%= f.association :machines, as: :check_boxes do |m| %> 
 

 
    <%= m.check_box :machine_id, class: 'w3-check' %> 
 
    <%= m.label :name, class: 'w3-validate' %> 
 

 
<% end %>

来源

2016-07-23 Code-MonKy

原来有是通过HTML属性由input_html和label_html到simple_form标签的选项。你可以找到从Here 所有选项为了您上面的问题，你可以这样做

<%= f.association :machines, as: :check_boxes, input_html:{class: 'w3-check'} ,label_html: {class: 'w3-validate'}%>

这将增加在所有计算机上的复选框，并w3-validate在所有这些复选框的标签w3-check类，然后你可以风格相应

来源

2016-07-23 14:42:41

随着input_html我终于能够达到项目的输入标签。谢谢，这解决了我80％的问题。我仍然无法达到标签标签。这个label_html将目标放在复选框列表的上方。这很好，但我需要一个项目的标签来确实添加'w3-validate'。 –

你可以使用'wrapper_html：{class：'checkbox_container'}'这会将这个类添加到所有复选框的父类中。然后，您可以通过'.checkbox_container label {border：1px solid gray}'应用'css'。这将适用于所有与'机器'相对应的标签上的css –

谢谢。我觉得这有点麻烦，但如果没有其他方式做这件事比我想它将不得不做。 btw与sass是不是有一种方法来扩展预定义类的CSS选择器？无论如何，我可以自己看看这个。 –

简单的表单关联与默认输入类型冲突

回答

相关问题