Integrating Bootstrap-looking form controls with Simple Form.
-
Add to your application's Gemfile:
gem 'simple_form-bootstrap'
. The following types of input controls are supported, so long they are properly installed in your application. Ensure that the control is included in yourapplication.js
before the Simple Form-Bootstrap JavaScript.- If you want to use Date/Time pickers, install the
bootstrap3-datetimepicker-rails
gem. - If you want to use the nicely styled Bootstrap Select picker, install the
bootstrap-select-rails
gem. - If you want to use the Token picker, you need to
a. Install the
bootstrap_tokenfield_rails
andtwitter-typeahead-rails
gems. b. Requiretwitter/typeahead
andbootstrap-tokenfield
in that order inapplication.js
. c. Requiretokenfield-typeahead
andbootstrap-tokenfield
in that order inapplication.css
. d. These extra@extend
s are needed for Typeahead.js 0.11:.tt-menu { @extend .tt-dropdown-menu; } .tt-suggestion.tt-selectable:hover { @extend .tt-suggestion.tt-cursor; }
- If you want to use Date/Time pickers, install the
-
Add to your application's javascript:
//= require simple_form-bootstrap
-
Empty the Simple Form initializer:
SimpleForm.setup do |config| end ```
1. You can still put configuration settings in, but it should no longer be necessary.
- Restart your development server.
- It adds the appropriate button styling to all buttons. By default, the
btn
andbtn-default
styles are added to all buttons. Submit buttons getbtn-primary
instead ofbtn-default
. - It allows
submit
buttons to accept blocks. When a block is specified, the submit button will use a <button> tag instead of an <input> tag.