如何用Rails中的div包装每个选择的date_select?

Tho*_*mas 11 html forms wrapper ruby-on-rails-3

我正在使用Ruby on Rails 3为用户创建一个表单,在那里他可以保存他的生日.控制器和模型周围的所有操作都可以正常工作.但我在使用这种形式的样式时遇到了麻烦.

对于我的表单中的每个选择,我在它周围包裹一个div,来设计它,通常效果很好.问题date_select是它会生成三个选择框,这些框都被包装到一个div中.作为Haml的示例,该字段的代码如下所示:

.select-wrapper
  = f.date_select :birthday, :start_year => Time.now.year - 120, :end_year => Time.now.year
Run Code Online (Sandbox Code Playgroud)

.select_wrapper创建围绕这三个选择框一个div,但我需要每一个选择框,有它自己的包装.有什么方法可以解决这个问题吗?

任何帮助,将不胜感激.谢谢.

iwa*_*bed 9

方法1(困难)

重写date_select代码以便为您处理此特殊实例:https://github.com/rails/rails/blob/master/actionview/lib/action_view/helpers/date_helper.rb#L283

方法2(简单)

使用jQuery:

// Find all select boxes that have an ID attribute containing "birthday"
// and wrap a div tag around them with a certain class
$('select[id*="birthday"]').wrapAll('<div class="select_wrapper">');
Run Code Online (Sandbox Code Playgroud)


小智 8

我正在使用涉及参数的解决方案:date_separator.有点像这样:

.select-wrapper
  = f.date_select :birthday, :start_year => Time.now.year - 120, :end_year => Time.now.year, :date_separator => '</div><div class="select-wrapper">'
Run Code Online (Sandbox Code Playgroud)


小智 6

这不是最漂亮的,但对我来说效果很好......

<div class="small-4 columns"><%= f.date_select :release_date, {date_separator: "</div><div class='small-4 columns'>"} %></div>
Run Code Online (Sandbox Code Playgroud)

<div class="small-4 columns"></div>我希望所有内容都包含在哪里.基本上只是确保date_separator是我的标签的关闭和下一个标签的打开,并确保我的第一个标签的开头是在date_select和关闭之前我的最后一个标签是在date_select之后.