Как я могу добавить класс "ошибка" к вводу при ошибке с помощью simple_form?

Ответ 1

У меня была такая же проблема. Мое решение для этого:

Я создал новый класс StringInput (который переопределяет исходный) и скопировал реализацию из rdoc. Я исправил этот код, чтобы проверить, есть ли ошибки в самом поле, если это так, я добавляю класс недействительным.

Поскольку я хотел использовать параметры оболочки, я добавил атрибут error_class в свой инициализатор.

Полный код:

Приложение/входы/string_input.rb

class StringInput < SimpleForm::Inputs::StringInput
  def input(wrapper_options = nil)
    unless string?
      input_html_classes.unshift("string")
      input_html_options[:type] ||= input_type if html5?
    end

    input_html_classes << wrapper_options[:error_class] if has_errors?
    merged_input_options = merge_wrapper_options(input_html_options, wrapper_options)

    @builder.text_field(attribute_name, merged_input_options)
  end
end

конфигурации/Инициализаторы/simple_form.rb

SimpleForm.setup do |config|
  config.error_notification_class = 'alert alert-danger'
  config.button_class = 'waves-effect waves-light btn'

  config.wrappers tag: :div, class: :input, error_class: :"error-field" do |b|
    # Form extensions
    b.use :html5
    b.optional :pattern
    b.use :maxlength
    b.use :placeholder
    b.use :readonly

    # Form components
    b.use :label
    b.use :input, class: 'validate', error_class: 'invalid'
    b.use :hint,  wrap_with: { tag: :span, class: :hint }
    b.use :error, wrap_with: { tag: :span, class: :error }
  end
end

Это добавляет определенный класс ошибок на все ваши строковые входы.

Ответ 2

Вы можете сделать это, используя error_html:

<%= f.input :attr, error_html: { class: 'custom-error-class' } %>

Ответ 3

simple_form добавляет класс field_with_errors к элементу обертки. Вы можете использовать это, чтобы ваш вход выглядел иначе:

.field_with_errors input { ... }

Ответ 4

Спасибо @vince-v,

Используя вашу информацию, я приступил к выполнению этой работы для применения класса ошибок ко всем типам входов, включая метки, если они настроены с помощью error_class.

# lib/inputs/base.rb
module SimpleForm
  module Inputs
    class Base
      def merge_wrapper_options(options, wrapper_options)
        working_wrapper_options = wrapper_options.dup

        if working_wrapper_options
          if working_wrapper_options[:error_class] && has_errors?
            working_wrapper_options[:class] =
              [working_wrapper_options[:class]] + \
              [working_wrapper_options[:error_class]]
          end
          working_wrapper_options.delete(:error_class)

          working_wrapper_options.merge(options) do |key, oldval, newval|
            case key.to_s
            when "class"
              Array(oldval) + Array(newval)
            when "data", "aria"
              oldval.merge(newval)
            else
              newval
            end
          end
        else
          options.dup
        end
      end
    end
  end
end

# config/initializers/simple_form.rb
require 'inputs/base.rb

Ответ 5

Моим решением было создать инициализатор со следующим:

inputs = %w[
  CollectionSelectInput
  DateTimeInput
  FileInput
  GroupedCollectionSelectInput
  NumericInput
  PasswordInput
  RangeInput
  StringInput
  TextInput
]

inputs.each do |input_type|
  superclass = "SimpleForm::Inputs::#{input_type}".constantize

  new_class = Class.new(superclass) do
    def input_html_classes
      if has_errors?
        super.push('form-control-danger')
      else
        super
      end
    end
  end

  Object.const_set(input_type, new_class)
end

Ответ 6

Теперь проще с simple_form 3.5.0.

Переопределите существующий вход (т.е. StringInput), создав новый класс с тем же именем (docs). Затем переопределите метод input_html_classes:

# app/inputs/string_input.rb
class StringInput < SimpleForm::Inputs::StringInput
  def input_html_classes
    has_errors? ? super.push('custom-error-class') : super
  end
end