简体   繁体   English

如何在simple_form中使用div来包围输入而不包围其各自的标签(使用f.input)

[英]How can I surround inputs with a div in simple_form without surrounding their respective label (with f.input)

I'm using a custom theme for twitter bootstrap that surrounds the inputs in a div this way: 我正在使用自定义主题的twitter bootstrap以这种方式围绕div中的输入:

    = simple_form_for(@user_session) do |f|
      .control-group
        = f.label :username, 'Usuario', class: 'control-label'
        .controls
          = f.input_field :username

I want to use only f.input to save coding in large forms, I ran rails generate simple_form:install to be able to modify the configuration, currently I have: 我想只使用f.input以大表格保存编码,我运行rails generate simple_form:install能够修改配置,目前我有:

    = simple_form_for(@user_session) do |f|
      = f.input :username, :label => 'Usuario'

And it generates almost all the markup I need (adding the respective classes in initializers/simple_form): 它生成了我需要的几乎所有标记(在initializers / simple_form中添加相应的类):

<form action="/user_sessions" class="form-horizontal new_user_session" method="post">
      ...
      <div class="control-group username">
          <label class="username control-label" for="user_session_username">Usuario</label>
          <input class="username" id="user_session_username" name="user_session[username]" size="50" type="text" />
      </div>
      ...
</form>

It only needs and extra 'div' with the class 'controls' surrounding the input tag but not the label, is there any way to achieve this? 它只需要和输入标签周围的类“控件”而不是标签的额外“div”,有没有办法实现这一点?

Thanks! 谢谢!

Finally found how to do it, configuring the wrapper this way adds the required div for bootstrap: 终于找到了如何做到这一点,这样配置包装器为bootstrap添加了所需的div:

initializers/simple_form 初始化/ simple_form

config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
  b.use :html5
  b.use :placeholder
  b.use :label
  b.wrapper :tag => 'div', :class => 'controls' do |ba|
    ba.use :input
    ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
    ba.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
  end
end

config.default_wrapper = :bootstrap

Found the answer here: http://blog.jamesalmond.com/using-simple-form-in-an-engine/ 在这里找到答案: http//blog.jamesalmond.com/using-simple-form-in-an-engine/

Hope it helps someone! 希望它可以帮到某人! See ya. 再见。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM