如何在simple_form 2中的包装器中向输入组件添加类

Nik*_* So 15 ruby-on-rails simple-form

我正在尝试class="text"在输入字段中使用名为:hinted in simple_form 2.0.0.rc的自定义包装器

config.wrappers :hinted do |b|
  b.use :input, :class => "text"
end
Run Code Online (Sandbox Code Playgroud)

但是输出没有那个类,我试过了

:wrap_with => {:class => 'text'} 
Run Code Online (Sandbox Code Playgroud)

无济于事

有谁知道这是怎么做的?

谢谢!

Rim*_*ian 35

使用:input_html工作.它有点笨重.

= f.input :email, :input_html => { :class => 'foo' }
Run Code Online (Sandbox Code Playgroud)

您还可以在所有表​​单元素上设置所有输入:

simple_form_for(@user, :defaults => { :input_html => { :class => "foo" } })
Run Code Online (Sandbox Code Playgroud)

但正如你所料,这适用于一切.

您可以创建自定义表单元素:

# app/inputs/foo_input.rb
class FooInput < SimpleForm::Inputs::StringInput
  def input_html_classes
    super.push('foo')
  end
end

// in your view:
= f.input :email, :as => :foo
Run Code Online (Sandbox Code Playgroud)

请参阅:https://github.com/plataformatec/simple_form/wiki/Adding-custom-input-components

您还可以创建自定义表单构建器:

def custom_form_for(object, *args, &block)
  options = args.extract_options!
  simple_form_for(object, *(args << options.merge(builder: CustomFormBuilder)), &block)
end

class CustomFormBuilder < SimpleForm::FormBuilder
  def input(attribute_name, options = {}, &block)
    options[:input_html].merge! class: 'foo'
    super
  end
end
Run Code Online (Sandbox Code Playgroud)


raf*_*nca 17

目前没有办法做到这一点.defaults如果需要,您可以使用这样的选项.

<%= simple_form_for(@user, :defaults => { :input_html => { :class => "text" } }) do %>
  <%= f.input :name %>
<% end %>
Run Code Online (Sandbox Code Playgroud)

  • @rafaelfranca也许我们应该实现它?如果这听起来像个好主意,我可以提供帮助 (2认同)
  • 这会将该类添加到所有输入元素.复选框,Everythang. (2认同)

cri*_*spy 12

此功能即将合并为主人(2012年10月):

https://github.com/plataformatec/simple_form/pull/622

然后你可以做这样的事情直接在输入字段上添加HTML属性:

SimpleForm.build :tag => :div, :class => "custom_wrapper" do |b|
  b.wrapper :tag => :div, :class => 'elem' do |component|
    component.use :input, :class => ['input_class_yo', 'other_class_yo']
    component.use :label, :"data-yo" => 'yo'
    component.use :label_input, :class => 'both_yo'
    component.use :custom_component, :class => 'custom_yo'
  end
end
Run Code Online (Sandbox Code Playgroud)

  • 天哪,这是黄金,它需要合并. (4认同)