如何在rails中将bootstrap css应用于simple_form_for表单?

时间:2013-03-02 09:22:10

标签: ruby-on-rails ruby-on-rails-3 twitter-bootstrap

我有一个像这样的simple_form

<%= simple_form_for(@name) do |f| %>
  <%= f.error_notification %>
  <div class="form-inputs">
    <%= f.input :fname %>
    <%= f.input :lname  %>
    <%= f.input :body %>        
  </div>

  <%= f.button :submit, 'submit' %>
<% end %>

我希望将标签设置为水平并将其他引导代码应用于它但我无法弄清楚如何操作,因为simple_form_for没有像form_for那样的任何div。

由于

2 个答案:

答案 0 :(得分:3)

它在宝石网站上得到了很好的解释:https://github.com/plataformatec/simple_form

1)通过runnning:

为simpleform生成twitter bootstrap配置
rails generate simple_form:install --bootstrap

2)按照示例应用程序中的示例进行操作:https://github.com/rafaelfranca/simple_form-bootstrap/blob/master/app/views/articles/_form.html.erb

<%= simple_form_for @name, :html => { :class => 'form-horizontal' } do |f| %>

  <%- if f.error_notification %>
    <div class="alert alert-error fade in">
      <a class="close" data-dismiss="alert" href="#">&times;</a>
      <%= f.error_notification %>
    </div>
  <%- end %>

  <div class="form-inputs">
    <%= f.input :fname %>
    <%= f.input :lname  %>
    <%= f.input :body %>        
  </div>

<% end %>

答案 1 :(得分:1)

来自simple_form docs

  

SimpleForm可以轻松集成到Twitter Bootstrap中。为此,您必须在安装生成器中使用bootstrap选项,如下所示:

     

rails生成simple_form:install --bootstrap

     

您必须确保在应用程序中添加了Twitter Bootstrap资产的副本。

     

有关更多信息,请参阅生成器输出,示例应用程序代码和实例示例应用程序。

     

注意: SimpleForm集成需要Twitter Bootstrap 2.0或更高版本。