Rails simple_form,在输入之前移动提示

Question

无论如何移动提示组件使其出现在输入之前？

当前显示的组件按以下顺序显示:标签,输入,提示,错误.我尝试添加:components选项,但这不起作用.

这是我的代码:

<%= f.input :content, 
            :components => [:label, :hint, :input], 
            :as => :text, 
            hint: 'Please 1) include your exact copy here, 2) upload your copy document in the next step, or 3) describe any content services to include in our estimate.', 
            required: true, 
            :label => "Copy" %>

Answer 1

您可以从以下位置修改输入部分的默认包装config/initializers/simple_form.rb:

b.use :label_input
b.use :hint,  wrap_with: { tag: :span, class: :hint }
b.use :error, wrap_with: { tag: :span, class: :error }

至:

b.use :label
b.use :hint,  wrap_with: { tag: :span, class: :hint }
b.use :error, wrap_with: { tag: :span, class: :error }
b.use :input

本节从默认生成的simple_form.rb的第42行开始

这将使单个复选框在出现错误时看起来有点奇怪,因此您还需要创建一个与原始配置重复的包装器版本,并将其设置为仅用于boolean输入类型.例如:

config.wrappers :checks, class: :input,
    hint_class: :field_with_hint, error_class: :field_with_errors do |b|
    b.use :html5
    b.use :placeholder
    b.optional :maxlength
    b.optional :pattern
    b.optional :min_max
    b.optional :readonly

    ## Inputs
    b.use :label_input
    b.use :hint,  wrap_with: { tag: :span, class: :hint }
    b.use :error, wrap_with: { tag: :span, class: :error }
end
config.wrapper_mappings = { boolean: :checks }

Answer 2

我想你可以省略它的提示input_field并hint单独使用帮助器.请参阅simple_form docs的摘录:

Simple Form还允许您使用label,hint,input_field,error和full_error助手(请查看每种方法的rdocs以获取更多信息):

<%= simple_form_for @user do |f| %>
  <%= f.label :username %>
  <%= f.input_field :username %>
  <%= f.hint 'No special characters, please!' %>
  <%= f.error :username, id: 'user_name_error' %>
  <%= f.full_error :token %>
  <%= f.submit 'Save' %>
<% end %>