我已经将bootstrap更新为版本3.除了由simple_form gem生成的表单之外,一切正常。我不知道我怎么能把这两者结合在一起。我在github项目资源库中找不到任何有用的建议。那么,有没有人有我的解决方案?simple_form与bootstrap的集成3
15
A
回答
14
这里有一个博客文章http://stabco.tumblr.com/post/59760641051/simple-form-bootstrap3-integration,看起来像一个很好的解决方案。它更新初始化,以适应自举3
11
1
您需要通过在config/initializers中创建初始化程序并填充下面的内容来创建引导程序特定的simple_form设置。
# 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
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/。
所以,如果你更新你的简单形式到这个版本,你应该很好。
0
好消息大家:为2014年4月,Bootstrap 3 integration is more fully supported,在新版本提供了额外包装的。
我们刚刚发布了简单的表单3.1.0.rc1的支持来引导3. 为了能够,我们铲平了包装API,使其更具可扩展 ,并允许开发者直接进行配置,而不是依靠全球的国家。 经过这样的改进,这是非常容易简单形式配置更改为 工作,引导3
您可以通过一个示例应用在这里看到工作中的新功能:http://simple-form-bootstrap.plataformatec.com.br/
相关问题
- 1. 无法将Datatables与Bootstrap 3集成
- 2. 将Bootstrap 3 Typeahead与Bootstrap标记输入集成
- 3. html行与simple_form 2.1.2和bootstrap 3/Rails 3.2错误对齐
- 4. 使用simple_form与引导3
- 5. 在simple_form中集成select2
- 6. 与Laravel集成Bootstrap主题
- 7. 将ng2-bootstrap与Angular2集成
- 8. 将Twitter Bootstrap与Smarty集成
- 9. Bootstrap Multiselect与WTForms集成
- 10. CakePHP与ExtJS 3的集成
- 11. bootstrap-wysihtml5-rails with simple_form
- 12. 使用i18n与Bootstrap-Rails和Simple_Form
- 13. 将Twitter Bootstrap与Asp.net MVC 3表格集成
- 14. 将Paypal与Phalcon 3集成
- 15. bootstrap-wysihtml5集成
- 16. Django Bootstrap集成
- 17. 如何将Bootstrap与Eliom集成?
- 18. 将Twitter Bootstrap popover与D3.js集成
- 19. 如何将bootstrap与jsf集成?
- 20. 如何将bootstrap模板与typo3集成?
- 21. 将Twitter Bootstrap导航栏与XenForo集成
- 22. 将hstore列与simple_form集成到Rails 4中
- 23. Bootstrap 3与石工
- 24. 与simple_form
- 25. Angular-Kendo + Bootstrap集成?
- 26. 集成Bootstrap和GWT
- 27. 集成spring 3 mvc与GWT的经验?
- 28. Simple_form集合禁用
- 29. simple_form集合标签
- 30. Rails上的Bootstrap popovers simple_form输入
这是自举2 – Edward