Интеграция simple_form с бутстрапом 3

Ответ 1

Здесь есть запись в блоге http://stabco.tumblr.com/post/59760641051/simple-form-bootstrap3-integration, которая выглядит как хорошее решение. Он обновляет инициализатор в соответствии с загрузкой 3.

Ответ 2

Эта идея очень помогла мне:

https://gist.github.com/tokenvolt/6599141

Спасибо!

Ответ 3

Только что выпущена простая версия 3.1.0.rc1, которая должна решить ваши проблемы с интеграцией. См. Сообщение в блоге об этом на http://blog.plataformatec.com.br/2014/04/bootstrap-3-support-for-simple-form/ или просто посмотрите последнюю простую форму для Bootstrap здесь: http://simple-form-bootstrap.plataformatec.com.br/.

Итак, если вы обновите свою простую форму до этой версии, вам должно быть хорошо.

Ответ 4

Вам нужно создать специальный параметр простой_загрузки начальной загрузки, создав инициализатор в config/initializers и заполнив приведенным ниже содержимым.

# Use this setup block to configure all options available in SimpleForm.
SimpleForm.setup do |config|
  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.wrappers :prepend, 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 |input|
      input.wrapper tag: 'div', class: 'input-prepend' do |prepend|
        prepend.use :input
      end
      input.use :hint,  wrap_with: { tag: 'span', class: 'help-block' }
      input.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
    end
  end

  config.wrappers :append, 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 |input|
      input.wrapper tag: 'div', class: 'input-append' do |append|
        append.use :input
      end
      input.use :hint,  wrap_with: { tag: 'span', class: 'help-block' }
      input.use :error, wrap_with: { tag: 'span', class: 'help-inline' }
    end
  end

  # Wrappers for forms and inputs using the Twitter Bootstrap toolkit.
  # Check the Bootstrap docs (http://twitter.github.com/bootstrap)
  # to learn about the different styles for forms and inputs,
  # buttons and other elements.
  config.default_wrapper = :bootstrap
end

Ответ 5

Хорошие новости: по состоянию на апрель 2014 года Интеграция с Bootstrap 3 более полно поддерживается, с дополнительными оболочками, представленными в новой версии.

Мы только что выпустили Simple Form 3.1.0.rc1 с поддержкой Bootstrap 3. Чтобы это стало возможным, мы повысили уровень API Wrapper, чтобы сделать его более расширяемым и позволить разработчикам напрямую настраивать его, а не полагаться на глобальное состояние. После таких улучшений было очень легко изменить конфигурацию Simple Form на работа с Bootstrap 3.

Вы можете увидеть новую функциональность в действии с помощью примера приложения: http://simple-form-bootstrap.plataformatec.com.br/